Pseudo Classe CSS :valid

La pseudo-classe :valid sélectionne des éléments <form> avec une valeur qui valide selon les paramètres de l'éléments.

Le sélecteur :valid ne fonctionne que pour former les éléments <input> avec les attributs min et max, champs de courriel sans un courriel légal, ou champs de nombre sans une valeur numérique.

Version

CSS3

Syntaxe

:valid {
css declarations;
}

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style>
      input{
      border:1px solid #cccccc;
      padding:5px 10px;
      }
      input:valid {
      background-color: #eeeeee;
      }
    </style>
  </head>
  <body>
    <h2>Exemple du sélecteur :valid</h2>
    <form>
      <input type="email" value="[email protected]">
    </form>
  </body>
</html>