浮动

使用响应式 float 工具在任何断点上应用自定义 float。

概述

Float 工具类使用 CSS float property 来根据当前的视图端口大小应用 float。

类

轻松切换一个带有类的 float：

template

<template>
  <div>
    <div class="float-left">Float left on all viewport sizes</div><br>
    <div class="float-right">Float right on all viewport sizes</div><br>
    <div class="float-none">Don't float on all viewport sizes</div>
  </div>
</template>

响应式

Floats 也可以在每个断点（视图）的基础上适用。

template

<template>
  <div>
    <div class="float-sm-left">Float left on viewports sized SM (small) or wider</div><br>
    <div class="float-md-left">Float left on viewports sized MD (medium) or wider</div><br>
    <div class="float-lg-left">Float left on viewports sized LG (large) or wider</div><br>
    <div class="float-xl-left">Float left on viewports sized XL (extra-large) or wider</div><br>
  </div>
</template>

以下是所有可用的支持类列表：

• .float-left
• .float-right
• .float-none
• .float-sm-left
• .float-sm-right
• .float-sm-none
• .float-md-left
• .float-md-right
• .float-md-none
• .float-lg-left
• .float-lg-right
• .float-lg-none
• .float-xl-left
• .float-xl-right
• .float-xl-none