manuel de référence CSS

règles CSS @

大全 des propriétés CSS

Fonctions CSS Complète des sélecteurs CSS

Sélecteur :invalid CSS

Le pseudo-classe :invalid CSS représente n'importe quel <input> ou autre élément <form> whose content has not passed validation .

　Manuel complet des sélecteurs CSS

Exemple en ligne

Si la valeur de l'élément <input> est illégale, définissez le style en bleu :

Exemple

!DOCTYPE html
<html>
<head>
<meta charset="utf-8">　
<title>Formation de base(oldtoolbag.com)<//title>　
<style>
input:invalid
{
　　　　border:2px solide bleu;
}
</style>
</head>
<body>
<h3>Exemple de sélecteur :invalid</h3>
<input type="email" value="supportEmail"　/>
<p>Entrez une e-adresse e-mail, regardez les changements de style.</p>
</body>
</html>

Voyons voir ‹/›

Définition et utilisation

Le sélecteur :invalid est utilisé pour définir un style spécifique lorsque la valeur d'un élément de formulaire est illégale.

Attention : 　Le sélecteur :invalid ne s'applique qu'aux éléments qui peuvent spécifier une valeur de plage, par exemple les attributs min et max d'un élément <input>, ainsi que les champs email corrects, les champs numériques valides, etc.

Compatibilité des navigateurs

Les nombres dans le tableau indiquent la version du premier navigateur qui prend en charge cette propriété.

Sélecteur
:invalid	10.0	10.0	4.0	5.0	10.0

Syntaxe d'utilisation CSS

/*　Vous pouvez sélectionner n'importe quel <input> non valide　*/
input:invalid　{
　　background-color: rose;
}

Cette pseudo-classe est très utile pour mettre en évidence les erreurs de champ de l'utilisateur.

Pages associées

Sélecteurs CSS :valid

　Manuel complet des sélecteurs CSS

Fonctions CSS Complète des sélecteurs CSS