Ang Tailwind CSS ay nagbibigay ng “ malinaw ” mga utility na kumokontrol sa pag-uugali ng isang partikular na elemento kapag ito ay nasa tabi ng anumang lumutang na elemento. Halimbawa, ang 'clear-left' at 'clear-right' na mga utility class ay nagbibigay-daan sa mga developer na gawin ang mga tinukoy na elemento na ilipat sa ibaba ng anumang left-floated o right-floated na elemento sa container. Gayunpaman, kung minsan, gustong i-disable ng mga user ang anumang malinaw na inilapat sa ilang partikular na elemento at payagan silang lumitaw sa tabi ng mga floated na elemento. Sa ganitong mga sitwasyon, ang utility na 'clear-none' ay maaaring gamitin upang tukuyin ang default na halaga ng elemento.
Ipapakita ng artikulong ito ang pamamaraan upang hindi paganahin ang lahat ng inilapat na clear sa Tailwind CSS.
Paano I-disable ang Lahat ng Applied Clears sa Tailwind?
Upang i-disable ang lahat ng inilapat na clear sa Tailwind, gumawa ng HTML file at idagdag ang “ malinaw-wala ” utility class na may gustong elemento sa HTML program. Nire-reset ng utility na ito ang anumang 'malinaw' na inilapat sa isang partikular na elemento at tinutukoy ang default na halaga.
Syntax
< elemento klase = 'malinaw-wala' > ... elemento >
Halimbawa
Sa halimbawang ito, gagamitin namin ang ' malinaw-wala 'utility na may ' ” na elemento upang i-reset ang inilapat ay lumilinaw at payagan itong lumutang sa kaliwa at kanang bahagi:
< katawan >
< div klase = 'h-96 mx-10 p-8 bg-sky-500' >
< img src = 'tailwindcss_img.png' klase = 'float-left p-3 w-28 h-24' lahat = 'larawan' />
< img src = 'tailwindcss_img.png' klase = 'float-right p-3' lahat = 'larawan' />
< p klase = 'malinaw-wala' > Nagbibigay ang Tailwind CSS 'malinaw' mga utility upang kontrolin ang pagbabalot ng nilalaman sa paligid ng isang elemento.
Ipapakita ng halimbawang ito kung paano i-disable ang lahat ng inilapat na clear sa mga elemento. Upang i-reset ang anumang inilapat na clear sa isang partikular na elemento, ang 'malinaw-wala' ginagamit ang utility. p >
div >
katawan >
dito:
- “ lumutang pakaliwa Pinalutang ng klase ang
na elemento sa kaliwang bahagi ng lalagyan.
- “ lumutang-kanan ' pinalutang ng klase ang
na elemento sa kanang bahagi ng lalagyan.
- “ malinaw-wala ” class ay hindi pinapagana ang anumang malinaw na inilapat sa
na elemento at pinapayagan ang elemento na lumutang sa magkabilang panig.
Output
Sa web page sa itaas, mapapansing lumulutang ang nilalaman sa magkabilang panig ng lalagyan. Ito ay nagpapahiwatig na ang lahat ng mga inilapat na clear ay hindi pinagana mula sa tinukoy na elemento.
Konklusyon
Upang i-disable ang lahat ng inilapat na clear sa Tailwind, gamitin ang ' malinaw-wala ” utility class na may gustong elemento sa HTML program. Nire-reset ng utility na ito ang anumang malinaw na inilapat sa isang partikular na elemento at tinutukoy ang default na halaga. Para sa pag-verify, mag-navigate sa web page at tingnan ang mga pagbabago. Ang artikulong ito ay nagpakita ng halimbawa upang hindi paganahin ang lahat ng inilapat na clear sa Tailwind CSS.