Tailwind CSS proporciona ' clar ” utilitats que controlen el comportament d'un element determinat quan es troba al costat de qualsevol element flotant. Per exemple, les classes d'utilitat 'clear-left' i 'clear-right' permeten als desenvolupadors fer que els elements especificats es moguin per sota de qualsevol element flotant a l'esquerra o a la dreta del contenidor. Tanmateix, de vegades, els usuaris volen desactivar qualsevol clara aplicada a determinats elements i permetre que apareguin al costat dels elements flotants. En aquestes circumstàncies, es pot utilitzar la utilitat 'clear-none' per definir el valor predeterminat de l'element.
Aquest article exemplificarà el procediment per desactivar tots els esborrats aplicats a Tailwind CSS.
Com desactivar tots els esborrats aplicats a Tailwind?
Per desactivar tots els esborrats aplicats a Tailwind, feu un fitxer HTML i afegiu el ' clar-cap ” classe d'utilitat amb l'element desitjat al programa HTML. Aquesta utilitat restableix qualsevol 'clear' que s'aplica a un element específic i defineix el valor predeterminat.
Sintaxi
< element classe = 'clar-cap' > ... element >
Exemple
En aquest exemple, utilitzarem el ' clar-cap ' utilitat amb el ' ” element per restablir les clares aplicades i permetre que surti als costats esquerre i dret:
< cos >
< div classe = 'h-96 mx-10 p-8 bg-sky-500' >
< img src = 'tailwindcss_img.png' classe = 'float-esquerra p-3 w-28 h-24' tot = 'imatge' />
< img src = 'tailwindcss_img.png' classe = 'float-dreta p-3' tot = 'imatge' />
< pàg classe = 'clar-cap' > Tailwind CSS proporciona 'clar' utilitats per controlar l'embolcall del contingut al voltant d'un element.
Aquest exemple mostrarà com desactivar tots els esborrats aplicats als elements. Per restablir les clares aplicades a un element concret, el 'clar-cap' s'utilitza la utilitat. pàg >
div >
cos >
Aquí:
- “ flota a l'esquerra ” classe flota l'element
al costat esquerre del contenidor.
- “ flota a la dreta ” classe flota l'element
al costat dret del contenidor.
- “ clar-cap ” La classe desactiva qualsevol clara aplicada a l'element
i permet que l'element floti als dos costats.
Sortida
A la pàgina web anterior, es pot observar que el contingut flota a banda i banda del contenidor. Això indica que tots els esborrats aplicats s'han desactivat de l'element especificat.
Conclusió
Per desactivar tots els esborrats aplicats a Tailwind, utilitzeu el ' clar-cap ” classe d'utilitat amb l'element desitjat al programa HTML. Aquesta utilitat restableix qualsevol clar que s'aplica a un element concret i especifica el valor predeterminat. Per a la verificació, navegueu a la pàgina web i visualitzeu els canvis. Aquest article ha demostrat l'exemple per desactivar tots els esborrats aplicats a Tailwind CSS.