Desminifica CSS en línia
Introdueix un full d'estil comprimit i torna'l a llegir amb comoditat. Cada selector i declaració ocupa una línia, amb els blocs i les consultes de mitjans sagnats com els escriuries a mà.
Per què el CSS de producció ocupa una sola línia
Els fulls d'estil es minifiquen pel mateix motiu que els scripts: el CSS bloqueja el renderitzat i cada byte estalviat contribueix a mostrar la pàgina més ràpidament. cssnano, Lightning CSS i els optimitzadors de Sass i PostCSS eliminen espais i comentaris, escurcen colors, fusionen regles duplicades i retiren l'últim punt i coma de cada bloc. Els entorns d'utilitats fan el resultat encara més dens, ja que un full Tailwind compilat pot contenir milers de regles minúscules gairebé sense separació.
Comprova la cascada
La raó principal per formatar un full d'estil és entendre per què s'aplica una regla o per què no ho fa. Amb cada selector en una línia i les declaracions sagnades a sota, pots seguir la cascada: trobar totes les regles d'un element, comparar-ne l'especificitat, veure quina apareix al final i descobrir aquell important que sobreescriu la teva feina. Les consultes de mitjans i el seu contingut es tornen a veure com a blocs, cosa que facilita seguir el comportament adaptatiu.
S'admet el CSS modern
El formatador entén el CSS actual. Propietats personalitzades, expressions calc i clamp, abreviacions de grid i flexbox, consultes de contenidor, regles imbricades, capes, blocs supports i keyframes es formaten correctament. Les llistes llargues de selectors es reparteixen en diverses línies perquè es puguin llegir i es conserven els comentaris que han sobreviscut a la construcció. Les propietats estàndard i les que porten prefix de proveïdor es mantenen, simplement amb una disposició més clara.
Un consell per als entorns compilats
Quan formates un full Tailwind o Bootstrap compilat, el fitxer es fa llarg molt ràpidament; desenes de milers de línies són normals. Activa els números de línia i utilitza la cerca del navegador per trobar la classe o la propietat que t'interessa. Si vols reduir la mida del fitxer, el treball útil s'ha de fer a la configuració de construcció, perquè les regles no utilitzades ja s'han generat abans que comenci la minificació.
Preguntes freqüents
Puc desminificar un full Tailwind compilat?
Sí, és un dels usos més habituals d'aquesta pàgina. El resultat serà llarg perquè l'entorn genera una regla per cada classe d'utilitat. Activa els números de línia i fes servir la cerca del navegador per moure-t'hi.
Es recuperen els comentaris?
Només es conserven els que encara hi són. La majoria de minificadors eliminen tots els comentaris excepte els avisos legals, i els eliminats no es poden recuperar. El formatador presenta correctament els que han sobreviscut.
Funciona amb SCSS o Less?
Aquesta pàgina està pensada per a CSS estàndard, que és el que descarreguen els navegadors. Els fitxers de preprocessador amb variables, mixins o sintaxi específica de SCSS o Less no són l'entrada prevista, tot i que s'admet la imbricació del CSS estàndard.