Novità di Chrome: panoramica CSS
Ecco una nuova fantastica funzione sperimentale in Chrome! Ora possiamo ottenere una panoramica del CSS utilizzato in un sito, da quanti colori ci sono al numero di dichiarazioni inutilizzate … fino al numero totale di media query definite.
Ancora una volta, questa è una caratteristica sperimentale. Ciò non significa solo che è ancora in corso, ma significa che dovrai abilitarlo per iniziare a usarlo in DevTools.
- Apri DevTools (
Command+Option+Isu Mac;Control+Shift+Isu Windows) - Vai su Impostazioni DevTool ( o
Function+F1su Mac; oF1su Windows) - Fai clic su apri la sezione Esperimenti
- Abilita l’ opzione Panoramica CSS
Abbiamo una nuova scheda “Panoramica CSS” nella barra dei menu di DevTools quando le impostazioni sono chiuse. Assicurati che non sia nascosto nel menu di overflow se non lo vedi.
Si noti che il report è suddiviso in diverse sezioni, tra cui Colori, Informazioni sui caratteri, Dichiarazioni non utilizzate e Query multimediali. Sono molte le informazioni disponibili in una piccola quantità di spazio a portata di mano.
Questo è abbastanza carino, eh? Adoro che strumenti come questo stiano iniziando a spostarsi nel browser. Pensa a come questo può aiutarci non solo come front-end, ma anche come collaboriamo con i designer. Ad esempio, un designer può aprirlo e iniziare a controllare il nostro lavoro per assicurarsi che tutto, dalla tavolozza dei colori alla pila di caratteri, sia completamente intatto.
