浮动类

Foundation 包含一些有用的浮动类,可以为元素添加常见的定位行为。

左浮动/右浮动

您可以通过向元素添加 .float-left.float-right 类来更改元素的浮动行为。要清除浮动,请将 .clearfix 类添加到父元素。

左浮动/右浮动类使用 `!important` 来确保它们不会被更具体的 selectors 覆盖。此框架有意识地避免使用 `!important` 声明。这是少数几个这样做的组件之一。

浮动类在 从右到左 的环境中不会翻转方向——left 始终表示左,right 始终表示右。

<div class="callout clearfix">
  <a class="button float-left">Left</a>
  <a class="button float-right">Right</a>
</div>

居中浮动

好吧,它不是*真正*的浮动,但您可以将 .float-center 类添加到元素以启用自动边距居中技巧。请注意,这只适用于具有绝对宽度的元素,这意味着不是百分比或 auto 宽度。

<img src="assets/img/generic/voyager.jpg" class="float-center">