CSS di input

Risultato di validazione

Esempi di validazione CSS

Il CSS valido ha la sintassi corretta; il CSS non valido ha errori. Esempi:

CSS valido

CSS valido

CSS non valido – punto e virgola mancante

Alla prima regola manca un punto e virgola dopo 1200px.

CSS non valido – punto e virgola mancante

Incolla uno degli esempi nell'editor in alto per vedere il risultato della validazione. Usa Esempio per caricare altri dati.

Cos'è un Validatore CSS?

Il CSS (Cascading Style Sheets) ha regole di sintassi. Punti e virgola mancanti, parentesi graffe non chiuse, nomi di proprietà non validi o selettori malformati causano errori di analisi. Un validatore CSS verifica se il tuo foglio di stile è ben formato e riporta gli errori con la riga e la posizione. Le specifiche W3C CSS definiscono il linguaggio.

Questo strumento analizza il tuo CSS e riporta eventuali errori di sintassi. Funziona interamente nel tuo browser. Nulla viene inviato a un server. Per formattare il CSS valido, usa il Formattatore CSS. Per minificare, usa il Minificatore CSS.

Come usare questo strumento

1

Incolla o carica CSS

Copia il tuo CSS e incollalo nell'editor di sinistra. Puoi anche cliccare su Carica per caricare un file .css. Il pulsante Esempio carica dati di esempio.

2

Controlla il risultato di validazione

Il pannello di destra mostra Valido o Non valido. Se non valido, elenca gli errori con riga e posizione. I problemi comuni includono parentesi graffe non chiuse, punti e virgola mancanti, valori di proprietà non validi o media query malformate.

3

Correggi e rivalida

Correggi gli errori nell'input e rivalida. Per la formattazione, usa il Formattatore CSS. Per SCSS o Less, compila prima con SCSS in CSS o Less in CSS.

Errori CSS comuni

Le parentesi graffe } o le parentesi quadre ] non chiuse sono frequenti. I punti e virgola mancanti tra le proprietà possono causare errori di analisi a cascata. I nomi o i valori delle proprietà non validi (es. errori di battitura come dispaly invece di display) interrompono le regole. Anche i blocchi @media o @keyframes malformati causano errori. La specifica W3C CSS definisce la sintassi valida. Il Validatore CSS W3C offre validazione lato server per controlli completi.

Quando la validazione CSS è utile

La maggior parte degli sviluppatori ha bisogno della validazione quando esegue il debug di stili che non si applicano, integra CSS di terze parti o prima di distribuire in produzione. Un singolo errore di sintassi può rompere un intero foglio di stile. Eseguire il tuo CSS qui individua i problemi prima che causino problemi di layout o rendering. Strumenti di build come Vite o Webpack potrebbero non riportare sempre chiaramente gli errori CSS—validare qui ti dà numeri di riga precisi.

È utile anche prima di condividere gli stili con i compagni di squadra o inviare pull request. Per la compatibilità con i browser dopo la validazione, usa il Prefissatore CSS. Per formattare il CSS valido, usa il Formattatore CSS. Per SCSS o Less, compila prima con SCSS in CSS o Less in CSS.

Domande Frequenti

Cosa rende il CSS non valido?

Parentesi graffe o quadre non chiuse, punti e virgola mancanti, nomi o valori di proprietà non validi, selettori malformati o errori di sintassi in @media o @keyframes. Il validatore individua il problema.

Controlla il supporto del browser?

Questo strumento valida solo la sintassi—se il CSS è ben formato. Non verifica la compatibilità con il browser. Usa Can I Use per quello.

I miei dati sono privati?

Sì. La validazione avviene interamente nel tuo browser. Nessun dato viene inviato a un server.

Supporta SCSS o Less?

Questo strumento valida il CSS normale. Per SCSS o Less, compila prima usando SCSS in CSS o Less in CSS, poi valida l'output.

E i prefissi vendor?

Le proprietà con prefissi vendor (es. -webkit-, -moz-) sono valide. Il validatore le accetta. Per aggiungere prefissi automaticamente, usa il Prefissatore CSS.

Strumenti Correlati

Per la specifica CSS, vedi W3C CSS. MDN CSS è il riferimento. Il Validatore CSS W3C offre validazione lato server. Can I Use per il supporto browser.