CSS-Eingabe

Validierungsergebnis

CSS-Validierungsbeispiele

Gültiges CSS hat korrekte Syntax; ungültiges CSS enthält Fehler. Beispiele:

Gültiges CSS

Gültiges CSS

Ungültiges CSS – fehlendes Semikolon

Der ersten Regel fehlt ein Semikolon nach 1200px.

Ungültiges CSS – fehlendes Semikolon

Fügen Sie eines der Beispiele oben in den Editor ein, um das Validierungsergebnis zu sehen. Nutzen Sie Beispiel für weitere Daten.

Was ist ein CSS-Validator?

CSS (Cascading Style Sheets) hat Syntaxregeln. Fehlende Semikolons, nicht geschlossene Klammern, ungültige Eigenschaftsnamen oder fehlerhafte Selektoren verursachen Parse-Fehler. Ein CSS-Validator prüft, ob Ihr Stylesheet wohlgeformt ist und meldet Fehler mit Zeile und Position. Die W3C-CSS-Spezifikationen definieren die Sprache.

Dieses Tool parst Ihr CSS und meldet Syntaxfehler. Es läuft vollständig in Ihrem Browser. Nichts wird an einen Server gesendet. Zum Formatieren nutzen Sie den CSS Formatierer. Zum Minimieren den CSS Minimierer.

So verwenden Sie dieses Tool

1

CSS einfügen oder hochladen

Kopieren Sie Ihr CSS und fügen Sie es in den linken Editor ein. Sie können auch auf Hochladen klicken, um eine .css-Datei zu laden. Die Schaltfläche Beispiel lädt Beispieldaten.

2

Validierungsergebnis prüfen

Das rechte Panel zeigt Gültig oder Ungültig. Bei Ungültig werden Fehler mit Zeile und Position aufgelistet. Häufige Probleme: nicht geschlossene Klammern, fehlende Semikolons, ungültige Eigenschaftswerte oder fehlerhafte Media-Queries.

3

Korrigieren und erneut validieren

Korrigieren Sie Fehler in der Eingabe und validieren Sie erneut. Zum Formatieren nutzen Sie den CSS Formatierer. Für SCSS oder Less kompilieren Sie zuerst mit SCSS zu CSS oder Less zu CSS.

Häufige CSS-Fehler

Nicht geschlossene Klammern } oder eckige Klammern ] sind häufig. Fehlende Semikolons zwischen Eigenschaften können kaskadierende Parse-Fehler verursachen. Ungültige Eigenschaftsnamen oder -werte (z. B. Tippfehler wie dispaly statt display) brechen Regeln. Fehlerhafte @media- oder @keyframes-Blöcke verursachen ebenfalls Fehler. Die W3C-CSS-Spezifikation definiert die gültige Syntax. Der W3C CSS Validator bietet serverseitige Validierung.

Wann CSS-Validierung hilft

Viele Entwickler brauchen Validierung beim Debuggen von Styles, die nicht angewendet werden, bei der Integration von Drittanbieter-CSS oder vor dem Deployment. Ein einzelner Syntaxfehler kann ein ganzes Stylesheet brechen. Ihr CSS hier durchlaufen zu lassen fängt Probleme ab, bevor sie Layout- oder Rendering-Probleme verursachen. Build-Tools wie Vite oder Webpack melden CSS-Fehler nicht immer klar—die Validierung hier liefert präzise Zeilennummern.

Auch nützlich vor dem Teilen von Styles mit Kollegen oder vor Pull-Requests. Für Browser-Kompatibilität nach der Validierung nutzen Sie den CSS Prefixer. Zum Formatieren gültigen CSS den CSS Formatierer. Für SCSS oder Less kompilieren Sie zuerst mit SCSS zu CSS oder Less zu CSS.

Häufig gestellte Fragen

Was macht CSS ungültig?

Nicht geschlossene Klammern oder eckige Klammern, fehlende Semikolons, ungültige Eigenschaftsnamen oder -werte, fehlerhafte Selektoren oder Syntaxfehler in @media oder @keyframes. Der Validator zeigt die Stelle.

Prüft es Browser-Unterstützung?

Dieses Tool validiert nur die Syntax—ob das CSS wohlgeformt ist. Es prüft keine Browser-Kompatibilität. Nutzen Sie Can I Use dafür.

Sind meine Daten privat?

Ja. Die Validierung läuft vollständig in Ihrem Browser. Keine Daten werden an einen Server gesendet.

Unterstützt es SCSS oder Less?

Dieses Tool validiert reines CSS. Für SCSS oder Less kompilieren Sie zuerst mit SCSS zu CSS oder Less zu CSS, dann validieren Sie die Ausgabe.

Was ist mit Vendor-Prefixes?

Vendor-prefixierte Eigenschaften (z. B. -webkit-, -moz-) sind gültig. Der Validator akzeptiert sie. Zum automatischen Hinzufügen nutzen Sie den CSS Prefixer.

Verwandte Tools

Zur CSS-Spezifikation: W3C CSS. MDN CSS ist die Referenz. W3C CSS Validator bietet serverseitige Validierung. Can I Use für Browser-Unterstützung.