Struttura regole e dichiarazioni CSS

Gli sviluppatori usano Formattatore CSS prima di una revisione del codice, una sessione di debug o un passaggio di consegne.

Struttura regole e dichiarazioni CSS, per rendere più semplici revisione, modifica e debug. Tutto avviene gratis nel browser, senza creare un account.

Come si usa

Incolla il tuo foglio di stile nell'area di input, oppure importa uno dei file di codice accettati.
Avvia la formattazione; regole e dichiarazioni tornano con un'indentazione uniforme e interruzioni di riga chiare.
Leggi l'output e individua i blocchi che nel file originale sembravano compressi o fuori ordine.
Copia la versione ordinata nel tuo editor e confrontala con la sorgente prima di confermare qualsiasi modifica.
Svuota l'input prima di incollare un altro file, così nell'area dei risultati c'è un solo progetto alla volta.

Esempio

Uno sviluppatore eredita un foglio di stile scritto tutto d'un fiato, con ogni cosa stipata in poche righe. Incollalo qui, riprendi la versione indentata e leggila blocco per blocco: i selettori si allineano e ogni dichiarazione occupa la propria riga.

Limiti e formati

Gli errori di sintassi vengono lasciati intatti, quindi un punto e virgola mancante resta mancante dopo il passaggio.
Questo strumento cambia solo la presentazione: non rinomina classi né elimina regole che non usi più.
I file accettati includono HTML, CSS, JavaScript, JSON e SQL, mentre un file binario non sarà leggibile qui.
Su un foglio molto corto l'indentazione automatica aggiunge poco, quindi controlla che l'output si comporti esattamente come l'input.

Dove avviene il trattamento

La formattazione viene eseguita nel tuo browser. Il codice che incolli non viene copiato da nessuna parte e scompare quando chiudi la pagina, quindi lavorare su estratti di un progetto privato non comporta rischi aggiuntivi.

Domande frequenti

La formattazione cambierà l'aspetto della mia pagina?

No. Vengono toccati solo spazi, interruzioni di riga e indentazione. Selettori, proprietà e valori restano esattamente gli stessi, quindi il browser legge il foglio di stile come prima e la pagina visualizzata non si sposta.

Posso formattare un foglio di stile molto grande?

Dipende soprattutto dalla memoria del tuo dispositivo, dato che tutto il lavoro avviene nel browser. Su un file grande la pagina può rallentare; suddividi il foglio in parti ed eseguile una dopo l'altra.

Perché l'output contiene ancora una riga molto lunga?

Alcuni valori sono semplicemente lunghi, come uno stack di font o una funzione molto annidata. Il formattatore non divide i valori all'interno di una dichiarazione; si concentra sulla struttura dei blocchi di regole.