CSS: gap ​

.--gap-md — 在间距刻度上的 Flex/grid gap 实用工具，短写（--gap-sm）或长写（--gap-small）。可单独使用或链式附加到任何组件（.instui-view.--gap-sm）——已经从组件特定令牌设置其自身 gap 的组件可能会被覆盖。

Source: index.ts

用法 ​

css
@import "@pantoken/components/utilities.css";

演示 ​

示例 ​

html
<div class="--display-flex --gap-sm">
  <span>One</span>
  <span>Two</span>
</div>

修饰符 ​

修饰符描述
.--gap-md将中等间距令牌用作间隙。
.--gap-*跨短写与长写间距步长的间隙实用工具。

消耗代币 ​

Token类型值
--instui-component-shared-tokens-spacing-general-space-none<length>0rem
--instui-spacing-space-lg<length>1rem
--instui-spacing-space-md<length>0.75rem
--instui-spacing-space-sm<length>0.5rem
--instui-spacing-space-xl<length>1.5rem
--instui-spacing-space-xs<length>0.25rem
--instui-spacing-space2xl<length>2rem
--instui-spacing-space2xs<length>0.125rem