in English
Ukudada
Guqula okudadayo kuyo nayiphi na into, kuyo nayiphi na indawo yokuphumla, usebenzisa izixhobo zethu eziphendulayo zokudada.
Kweli phepha
Isishwankathelo
Ezi ndidi zoncedo zidada into ekhohlo okanye ekunene, okanye khubaza ukudada okudadayo, ngokusekelwe kubungakanani bangoku bokubona usebenzisa ipropati yeCSSfloat
. !important
ibandakanyiwe ukuphepha imiba ethile. Ezi zisebenzisa iindawo zokuqhawuka zembonakalo efanayo nenkqubo yethu yegridi. Nceda uqaphele izinto eziluncedo zokudada azinampembelelo kwizinto eziguqukayo.
Isiqalo sokudada kuzo zonke iisayizi zokujonga
Isiphelo sokudada kubo bonke ubungakanani bendawo yokujonga
Sukudada kuzo zonke iisayizi zezibuko
<div class="float-start">Float start on all viewport sizes</div><br>
<div class="float-end">Float end on all viewport sizes</div><br>
<div class="float-none">Don't float on all viewport sizes</div>
Ukusabela
Iiyantlukwano eziphendulayo zikwakhona float
kwixabiso ngalinye.
Isiqalo sokudada kwizibuko zokujonga ezinobungakanani be-SM (encinci) okanye banzi
Isiqalo sokudada kwizibuko zokujonga ubukhulu be-MD (phakathi) okanye banzi
Isiqalo sokudada kwindawo yokujonga isayizi ye-LG (enkulu) okanye ebanzi
Isiqalo sokudada kwizibuko zokujonga ezinobungakanani beXL (enkulu kakhulu) okanye banzi
<div class="float-sm-start">Float start on viewports sized SM (small) or wider</div><br>
<div class="float-md-start">Float start on viewports sized MD (medium) or wider</div><br>
<div class="float-lg-start">Float start on viewports sized LG (large) or wider</div><br>
<div class="float-xl-start">Float start on viewports sized XL (extra-large) or wider</div><br>
Nazi zonke iiklasi zenkxaso:
.float-start
.float-end
.float-none
.float-sm-start
.float-sm-end
.float-sm-none
.float-md-start
.float-md-end
.float-md-none
.float-lg-start
.float-lg-end
.float-lg-none
.float-xl-start
.float-xl-end
.float-xl-none
.float-xxl-start
.float-xxl-end
.float-xxl-none
Sass
Utilities API
Izinto eziluncedo zokudada zibhengezwa kwizinto eziluncedo zethu kwi-API kwi scss/_utilities.scss
. Funda indlela yokusebenzisa izinto eziluncedo API.
"float": (
responsive: true,
property: float,
values: (
start: left,
end: right,
none: none,
)
),