Tailwind CSS flex

指定如何弹性伸缩 Flex 元素。

使用 flex

使用 flex 类在容器上创建一个 Flex 布局，其子元素沿水平方向排列。

<div class="flex ...">
  <div>01</div>
  <div>02</div>
  <div>03</div>
</div>

使用 inline-flex 类创建一个行内 Flex 容器，宽度随内容收缩。

<span class="inline-flex ...">
  <svg>...</svg>
  <span>按钮</span>
</span>

在类名前加上断点变体，只在特定屏幕尺寸下启用 Flex 布局。

<div class="flex md:inline-flex ...">
  <!-- ... -->
</div>