Float & Clear
Float
float Breakpoints
設定物件能浮動排版。使用類別名稱為 .u-float{@bp}:。可針對不同斷點範圍切換浮動設定。
.u-float:l.u-float:r.u-float:n<div class="u-float:l"></div>
<div class="u-float:r"></div>
<div class="u-float:n"></div>
<div class="u-float@sm:l u-float@lg:r"></div>
Clearfix
clear
用於修正使用 Float 後，父層 DOM 失去高度的問題。使用類別為 .clearfix，並設定於 Float 物件的父層上。
沒有使用 Clear
.u-float:l.u-float:r使用 Clear
.u-float:l.u-float:r<div class="u-clearfix">
<div class="u-float:l"></div>
<div class="u-float:r"></div>
</div>
Clear
clear
用於修正使用 Float 產生的排版問題。使用類別為 .clear，並設定於 Float 物件之後。
沒有使用 Clearfix
.u-float:l.u-float:r使用 Clearfix
.u-float:l.u-float:r<div>
<div class="u-float:l"></div>
<div class="u-float:r"></div>
<div class="u-clear"></div>
</div>