CSS/Selektoren/valid

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Der :valid-Selektor kennzeichnet Formularelemente danach, ob eine Eingabe valide (gültig, zulässig) ist.

Syntax :valid
Parameter {{{Parameter}}}}}
Browsersupport Details: caniuse.com
Beispiel
input:valid {
      color: green;
}
input:invalid {
      background-color: #e00;
}
Im vorliegenden Beispiel ändert sich die Hintergrundfarbe des Eingabefelds von rot auf transparent und die Textfarbe auf grün, sobald etwas eingegeben wurde.
(Nutzer mit Rot-Grün-Sehschwäche würden bei einer Änderung der Hintergrundfarbe von Grün auf Rot keine Änderung erkennen, deshalb die Kennzeichnung durch zwei Merkmale.)


Siehe auch

Weblinks