Tailwind CSS pakub ' selge ” utiliidid, mis juhivad konkreetse elemendi käitumist, kui see asub mis tahes ujuva elemendi kõrval. Näiteks utiliidiklassid 'selge-vasak' ja 'selge-parem' võimaldavad arendajatel panna määratud elemendid konteineris vasakule või paremale ujuvatele elementidele allapoole liikuma. Kuid mõnikord soovivad kasutajad keelata teatud elementide jaoks rakendatud puhastustoimingud ja lubada neil kuvada ujuvate elementide kõrval. Sellistel juhtudel saab elemendi vaikeväärtuse määratlemiseks kasutada utiliiti „clear-none”.
See artikkel kirjeldab Tailwind CSS-is kõigi rakendatud tühjenduste keelamise protseduuri näidet.
Kuidas Tailwindis kõik rakendatud tühjendused keelata?
Kõigi Tailwindis rakendatud tühjenduste keelamiseks looge HTML-fail ja lisage ' selge-pole ” utiliidiklass soovitud elemendiga HTML-programmis. See utiliit lähtestab kõik konkreetsele elemendile rakendatud 'selge' ja määrab vaikeväärtuse.
Süntaks
< element klass = 'selge-pole' > ... element >
Näide
Selles näites kasutame ' selge-pole ' utiliit koos ' ” element lähtestamiseks rakendatud kustutab ja võimaldab sellel hõljuda vasakul ja paremal küljel:
< keha >
< div klass = 'h-96 mx-10 p-8 bg-sky-500' >
< img src = 'tailwindcss_img.png' klass = 'float-left p-3 w-28 h-24' kõike = 'pilt' />
< img src = 'tailwindcss_img.png' klass = 'float-right p-3' kõike = 'pilt' />
< lk klass = 'selge-pole' > Tailwind CSS pakub 'selge' utiliidid sisu mähkimise juhtimiseks elemendi ümber.
See näide näitab, kuidas keelata kõik elementidele rakendatud tühjendused. Konkreetsele elemendile rakendatud tühjenduste lähtestamiseks 'selge-pole' utiliiti kasutatakse. lk >
div >
keha >
Siin:
- “ ujuv-vasak ” klass ujutab elemendi
konteineri vasakule küljele.
- “ ujuk-parem ” klass ujutab elemendi
konteineri paremale küljele.
- “ selge-pole ” klass keelab kõik
elemendile rakendatud selged ja lubab elemendil hõljuda mõlemal küljel.
Väljund
Ülaltoodud veebilehel on näha, et sisu hõljub konteineri mõlemal küljel. See näitab, et kõik rakendatud tühjendused on määratud elemendist keelatud.
Järeldus
Tailwindis kõigi rakendatud tühjenduste keelamiseks kasutage selge-pole ” utiliidiklass soovitud elemendiga HTML-programmis. See utiliit lähtestab kõik selged, mis on rakendatud konkreetsele elemendile, ja määrab vaikeväärtuse. Kinnitamiseks navigeerige veebilehele ja vaadake muudatusi. See artikkel on näidanud näidet kõigi Tailwind CSS-i rakendatud tühjenduste keelamiseks.