Pseudoluokka invalid
Pseudoluokka invalid asettaa tyylin
syöttökentälle, johon on syötetty virheellinen
arvo tai arvo, joka ei vastaa määritettyä
tyyppiä.
Syntaksi
valitsija:invalid {
}
Esimerkki
Muutetaan syöttökentän tausta vaaleanpunaseksi, kun siihen syötetään virheellinen arvo, ja takaisin vihreäksi, kun arvo läpäisee valitun tyypin mukaisen tarkistuksen:
<p>Syötä sähköpostiosoitteesi</p>
<p><input type="email"></p>
input:invalid {
background: #E37D76;
}
input:valid {
background: #9DDFA4;
}
:
Katso myös
-
pseudoluokka
:valid,
joka asettaa tyylin syöttökentälle, johon on syötetty oikea arvo -
pseudoluokka
:default,
joka asettaa tyylin oletusarvoisille elementeille -
pseudoluokka
:in-range,
joka asettaa tyylin elementeille, joilla on määritetty arvoalue -
pseudoluokka
:out-of-range,
joka asettaa tyylin elementeille, joiden arvot ylittävät alueen