CSS-invoer

Validatieresultaat

CSS-validatievoorbeelden

Geldige CSS heeft correcte syntaxis; ongeldige CSS bevat fouten. Voorbeelden:

Geldige CSS

Ongeldige CSS – ontbrekend puntkomma

Aan de eerste regel ontbreekt een puntkomma na 1200px.

Ongeldige CSS – ontbrekend puntkomma

Plak een van de voorbeelden in de editor hierboven om het validatieresultaat te zien. Gebruik Voorbeeld om meer gegevens te laden.

Wat is een CSS-validator?

CSS (Cascading Style Sheets) heeft syntaxisregels. Ontbrekende puntkomma's, niet-gesloten accolades, ongeldige eigenschapsnamen of onjuiste selectors veroorzaken parsefouten. Een CSS-validator controleert of uw stylesheet goed gevormd is en meldt fouten met regel en positie. De W3C CSS-specificaties definiëren de taal.

Dit hulpmiddel parseert uw CSS en meldt syntaxfouten. Het draait volledig in uw browser. Er wordt niets naar een server gestuurd. Voor het formatteren van geldige CSS gebruikt u de CSS Formatter. Voor minificeren de CSS Minificeerder.

Hoe dit hulpmiddel te gebruiken

Plak of upload CSS

Kopieer uw CSS en plak het in de linker editor. U kunt ook op Uploaden klikken om een .css-bestand te laden. De knop Voorbeeld laadt voorbeeldgegevens.

Controleer het validatieresultaat

Het rechterpaneel toont Geldig of Ongeldig. Bij Ongeldig worden fouten met regel en positie weergegeven. Veelvoorkomende problemen: niet-gesloten accolades, ontbrekende puntkomma's, ongeldige eigenschapswaarden of onjuiste media queries.

Corrigeer en valideer opnieuw

Corrigeer fouten in de invoer en valideer opnieuw. Voor formatteren gebruikt u de CSS Formatter. Voor SCSS of Less compileer eerst met SCSS naar CSS of Less naar CSS.

Veelvoorkomende CSS-fouten

Niet-gesloten accolades } of haakjes ] komen vaak voor. Ontbrekende puntkomma's tussen eigenschappen kunnen cascaderende parsefouten veroorzaken. Ongeldige eigenschapsnamen of -waarden (bijv. typfouten zoals dispaly in plaats van display) breken regels. Onjuiste @media- of @keyframes-blokken veroorzaken ook fouten. De W3C CSS-specificatie definieert de geldige syntaxis. De W3C CSS Validator biedt server-side validatie.

Wanneer CSS-validatie helpt

Veel ontwikkelaars hebben validatie nodig bij het debuggen van styles die niet worden toegepast, het integreren van CSS van derden, of vóór deployment naar productie. Een enkele syntaxfout kan een hele stylesheet breken. Uw CSS hier doorlaten vangt problemen op voordat ze layout- of weergaveproblemen veroorzaken. Build-tools zoals Vite of Webpack melden CSS-fouten niet altijd duidelijk—valideren hier geeft u precieze regelnummers.

Ook nuttig vóór het delen van styles met teamgenoten of het indienen van pull requests. Voor browsercompatibiliteit na validatie gebruikt u de CSS Prefixer. Voor formatteren van geldige CSS de CSS Formatter. Voor SCSS of Less compileer eerst met SCSS naar CSS of Less naar CSS.

Veelgestelde vragen

Wat maakt CSS ongeldig?

Niet-gesloten accolades of haakjes, ontbrekende puntkomma's, ongeldige eigenschapsnamen of -waarden, onjuiste selectors of syntaxfouten in @media of @keyframes. De validator wijst de plek aan.

Controleert het browserondersteuning?

Dit hulpmiddel valideert alleen de syntaxis—of de CSS goed gevormd is. Het controleert geen browsercompatibiliteit. Gebruik Can I Use daarvoor.

Zijn mijn gegevens privé?

Ja. Validatie draait volledig in uw browser. Er worden geen gegevens naar een server gestuurd.

Ondersteunt het SCSS of Less?

Dit hulpmiddel valideert platte CSS. Voor SCSS of Less compileer eerst met SCSS naar CSS of Less naar CSS, valideer dan de uitvoer.

Hoe zit het met vendor-prefixes?

Eigenschappen met vendor-prefix (bijv. -webkit-, -moz-) zijn geldig. De validator accepteert ze. Voor automatisch toevoegen van prefixes gebruikt u de CSS Prefixer.

Gerelateerde hulpmiddelen

Voor de CSS-specificatie: W3C CSS. MDN CSS is de referentie. W3C CSS Validator biedt server-side validatie. Can I Use voor browserondersteuning.