:placeholder-shown

Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La pseudo-classe :placeholder-shown permet de représenter n'importe quel élément de formulaire affichant un texte de substitution.

Syntaxe

:placeholder-shown { style properties }

Exemples

CSS

input {
  border: 2px solid black;
  padding: 3px;
}

:placeholder-shown {
  border-color: silver;
}

HTML

<input placeholder="Saisir quelque chose ici">

Résultat

Spécifications

Spécification État Commentaires
Selectors Level 4
La définition de ':placeholder' dans cette spécification.
Version de travail Définition initiale.

Compatibilité des navigateurs

Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Edge Opera Safari
Support simple
(pour <input type="text">)
47.0 51.0 (51.0)[1] Pas de support Pas de support[2] 34.0 9.0
Prise en charge de type="number", type="time", et similaire ? Pas de support Pas de support Pas de support ? ?
Fonctionnalité Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support simple
(pour <input type="text">)
51.0 51.0 (51.0)[1] Pas de support Pas de support 9.2
Prise en charge de type="number", type="time", et similaire ? Pas de support Pas de support Pas de support ?

[1] Avant Gecko 51.0 (Firefox 51.0 / Thunderbird 51.0 / SeaMonkey 2.48), Gecko implémentait une version préfixée par -moz avec la pseudo-classe :-moz-placeholder. Celle-ci fut ensuite remplacée par le pseudo-élément ::-moz-placeholder puis la pseudo-classe standard fut implementée avec bug 1069012.

[2] La prise en charge de cette pseudo-classe a été demandée pour Microsoft Edge sur la page Developer Feedback.

Voir aussi

Étiquettes et contributeurs liés au document

Étiquettes : 
 Contributeurs à cette page : SphinxKnight
 Dernière mise à jour par : SphinxKnight,