Formattatore CSS

Informazioni sulla formattazione CSS

La minificazione rimuove spazi, commenti e caratteri ridondanti dal CSS per ridurre le dimensioni del file. L'abbellimento lo espande di nuovo in uno stile indentato con una regola per riga, più facile da scorrere e modificare.

La minificazione qui va leggermente oltre la rimozione degli spazi: riscrive anche i valori nella loro forma equivalente più breve, così background-color: white diventa background-color:#fff e color: #ff0000 diventa color:red, a seconda di quale richiede meno byte. Non analizza quali regole si applichino realmente a una pagina — è un compito distinto chiamato "rimozione del CSS inutilizzato" o tree-shaking, che richiede di conoscere il tuo HTML e JavaScript per capire cosa è superfluo, e questo strumento mantiene ogni regola che hai scritto. Un'eccezione alla rimozione dei commenti: un "commento bang" che inizia con /*! viene deliberatamente conservato, perché è la convenzione usata dagli strumenti di build per le note di licenza che devono sopravvivere alla minificazione.

Dove lo incontrerai

• Ridurre un foglio di stile prima di distribuirlo in produzione
• Riformattare un file CSS minificato per leggerlo o modificarlo
• Pulire stili copiati dal pannello di ispezione del browser
• Uniformare la formattazione prima di rivedere un diff CSS

Domande frequenti

La minificazione cambia l'aspetto della mia pagina?
No. Vengono rimossi solo spazi e commenti — ogni selettore, proprietà e valore resta esattamente come scritto.

Questo supporta SCSS o LESS?
No, solo CSS puro. Compila prima il tuo SCSS o LESS in CSS.

Il mio foglio di stile viene memorizzato?
No. La conversione avviene sul server solo per quella richiesta e dopo non viene conservato nulla.

Questo rimuove le regole CSS che la mia pagina in realtà non usa?
No. Quello è un compito diverso — di solito chiamato "rimozione del CSS inutilizzato" o tree-shaking — che richiede di confrontare il tuo CSS con l'HTML e il JavaScript reali per sapere quali selettori corrispondono davvero a qualcosa. Questo strumento rimuove solo spazi e sintassi ridondante e accorcia i valori alla loro forma equivalente più piccola; ogni regola che hai scritto esce intatta dall'altra parte, solo più compatta. Se un commento deve sopravvivere alla minificazione — una nota di licenza, ad esempio — fallo iniziare con /*! invece che con /*, e verrà conservato.