Pseudoluokka valid

Pseudoluokka valid asettaa tyylin syötekentille, joihin on syötetty oikea arvo tai arvo, joka vastaa määritettyä tyyppiä.

Syntaksi

cssvalitsija:valid {
  
}

Esimerkki

Muutetaan syötekentän tausta väri vaaleanpunaisesta vihreäksi, kun syötetty arvo täyttää valitun tyypin vaatimukset:

html<p>Syötä sähköpostiosoitteesi</p>
<p><input type="email"></p>

cssinput:invalid {
  background: #E37D76;
}
input:valid {
  background: #9DDFA4;
}

Результат:

Katso myös