Pseudo-classe placeholder-shown
La pseudo-classe placeholder-shown applique un style
à un input ou textarea lorsque le
texte d'indice (placeholder) est affiché, celui-ci disparaissant
après le début de la saisie de texte.
Syntaxe
sélecteur:placeholder-shown {}
Exemple
Définissons une bordure rouge pour l'input dans lequel le texte d'indice est affiché. Après la saisie de texte, la bordure deviendra verte :
<form>
<input placeholder="enter the text">
</form>
input {
border: 1px solid green;
}
input:placeholder-shown {
border-color: red;
}
:
Voir aussi
-
l'attribut
placeholder,
qui définit l'indice pour le champ de saisie -
le pseudo-élément
placeholder,
qui définit les styles pour l'indice