Float

Lülitage hõljukid mis tahes elemendil, mis tahes katkestuspunktis, kasutades meie reageerivaid hõljukutiliite.

Ülevaade

Need utiliidiklassid ujutavad elemendi vasakule või paremale või keelavad ujumise, võttes aluseks praeguse vaateava suuruse, kasutades CSS -i floatatribuuti . !importanton lisatud spetsiifilisuse probleemide vältimiseks. Need kasutavad samu vaateava murdepunkte kui meie ruudustikusüsteem. Pange tähele, et ujuki utiliidid ei mõjuta painduvaid esemeid.

klassid

Ujuki vahetamine klassiga:

<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>

Segud

Või Sass mixini poolt:

.element {
  @include float-left;
}
.another-element {
  @include float-right;
}
.one-more {
  @include float-none;
}

Vastutulelik

floatIga väärtuse jaoks on olemas ka reageerivad variatsioonid .

<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>

Siin on kõik tugiklassid;

• .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