Come funziona
Reindenta e riordina fogli di stile CSS o SCSS compressi o mal allineati per renderli leggibili. Utile per ispezionare stili minificati, esaminare CSS di terzi o unificare il formato prima di salvarlo.
Consente di scegliere il tipo di indentazione (spazi o tabulazioni), la dimensione del rientro e il fine riga. Ogni dichiarazione va su una riga propria e i selettori separati da virgole vengono disposti su righe distinte.
L'elaborazione è totalmente locale, nel tuo browser, con js-beautify. Formatta la presentazione; non minifica, non riordina le proprietà né verifica che le regole siano corrette.
Esempi
a,b{color:red;margin:0}a,
b {
color: red;
margin: 0
}I selettori vengono separati su righe e ogni proprietà viene rientrata.Casi d'uso
- Rendere leggibile un file .css minificato di un sito.
- Normalizzare l'indentazione di un foglio di stile prima di un commit.
- Esaminare e confrontare regole CSS di un framework o di una libreria.
- Riordinare SCSS incollato da documentazione o generatori.
Domande frequenti
Funziona anche per SCSS o LESS?
Formatta CSS e sintassi compatibili come SCSS, incluse le regole annidate. Non compila SCSS né LESS in CSS: riordina solo l'indentazione e le interruzioni di riga.
Riordina o raggruppa le proprietà?
No. Mantiene l'ordine originale di selettori e dichiarazioni. Cambia solo spaziatura, rientro e interruzioni di riga per migliorare la leggibilità.
È lo stesso che minificare il CSS?
No, è il contrario. Formattare aggiunge spazi e interruzioni per leggerlo meglio; minificare li elimina per ridurre le dimensioni del file. Per comprimere, usa lo strumento di minificazione.
Il mio codice viene caricato su un server?
No. La formattazione avviene interamente nel tuo browser; il CSS non lascia mai il tuo computer.