Tailwind CSS gir ' klar ” verktøy som kontrollerer oppførselen til et bestemt element når det er ved siden av et flytende element. For eksempel gjør verktøyklassene 'clear-left' og 'clear-right' det mulig for utviklere å få de spesifiserte elementene til å bevege seg under alle venstre- eller høyreflytende elementer i beholderen. Noen ganger ønsker imidlertid brukere å deaktivere all sletting som er brukt på visse elementer og la dem vises ved siden av de flytende elementene. Under slike omstendigheter kan 'clear-none'-verktøyet brukes til å definere standardverdien til elementet.
Denne artikkelen vil eksemplifisere prosedyren for å deaktivere alle anvendte slettinger i Tailwind CSS.
Hvordan deaktivere alle påførte tømmer i medvind?
For å deaktivere alle brukte slettinger i Tailwind, lag en HTML-fil og legg til ' klar-ingen ” verktøyklasse med ønsket element i HTML-programmet. Dette verktøyet tilbakestiller enhver 'clear' som brukes på et spesifikt element og definerer standardverdien.
Syntaks
< element klasse = 'klar-ingen' > ... element >
Eksempel
I dette eksemplet vil vi bruke ' klar-ingen ' verktøyet med ' element for å tilbakestille påførte tømmer og la det flyte på venstre og høyre side:
< kropp >
< div klasse = 'h-96 mx-10 p-8 bg-sky-500' >
< img src = 'tailwindcss_img.png' klasse = 'float-venstre p-3 w-28 h-24' alt = 'bilde' />
< img src = 'tailwindcss_img.png' klasse = 'flyte-høyre p-3' alt = 'bilde' />
< s klasse = 'klar-ingen' > Tailwind CSS gir 'klar' verktøy for å kontrollere innpakningen av innhold rundt et element.
Dette eksemplet vil vise hvordan du deaktiverer alle brukte slettinger for elementer. For å tilbakestille eventuelle anvendte slettinger til et bestemt element, 'klar-ingen' verktøyet brukes. s >
div >
kropp >
Her:
- ' flyte-venstre ”-klassen flyter
-elementet til venstre side av beholderen.
- ' flyte-høyre ”-klassen flyter
-elementet til beholderens høyre side.
- ' klar-ingen Klasse deaktiverer all clear brukt på
-elementet og lar elementet flyte på begge sider.
Produksjon
På nettsiden ovenfor kan det observeres at innholdet flyter på begge sider av beholderen. Dette indikerer at alle anvendte slettinger er deaktivert fra det angitte elementet.
Konklusjon
For å deaktivere alle påførte slettinger i Tailwind, bruk ' klar-ingen ” verktøyklasse med ønsket element i HTML-programmet. Dette verktøyet tilbakestiller enhver clear som brukes på et bestemt element og spesifiserer standardverdien. For verifisering, naviger til nettsiden og se endringer. Denne artikkelen har vist eksempelet for å deaktivere alle anvendte slettinger i Tailwind CSS.