--- title: ':-ms-input-placeholder' slug: 'Web/CSS/:-ms-input-placeholder' tags: - CSS - Non-standard - Pseudo-classe - Référence(2) translation_of: 'Web/CSS/:placeholder-shown' ---
{{Non-standard_header}}{{CSSRef}}

La pseudo-classe :-ms-input-placeholder représente le texte de substitution d'un élément de formulaire. Elle permet aux auteurs et aux développeurs web d'adapter l'apparence des textes de substitution. Cette pseudo-classe est propriétaire et est uniquement prise en charge par Internet Explorer et Edge.

Exemples

Dans l'exemple suivant, le champ « Identifiant » a un style particulier. Le texte de substitution est affiché de cette façon jusqu'à ce que le focus passe sur le champ (ce qui correspond à une saisie).

CSS

input {
  background-color:#E8E8E8;
  color:black;
}
/* Style pour le texte de substitution */
input.studentid:-ms-input-placeholder {
  font-style:italic;
  color: red;
  background-color: yellow;
}

HTML

<form id="test">
  <p><label>Saisir le nom : <input id="nom" placeholder="Nom de l'étudiant"/></label></p>
  <p><label>Saisir le domaine : <input id="domaine" placeholder="Domaine d'étude" /></label></p>
  <p><label>Saisir l'identifiant : <input type="num" pattern="[0-9]{8}" title="8 digit ID" id="sid" class="studentid" placeholder="Identifiant à 8 chiffres" /></label></p>
  <input type="submit" />
</form>

Résultat

{{EmbedLiveSample("Exemples","300","300")}}

Capture d'écran

Spécifications

Cette pseudo-classe est une pseudo-classe propriétaire liée à Trident/Microsoft et ne fait partie d'aucune spécification. MSDN documente cette pseudo-classe.

Compatibilité des navigateurs

{{CompatibilityTable}}

Fonctionnalité Chrome Firefox (Gecko) Edge Internet Explorer Opera Safari (WebKit)
Support simple {{CompatNo}} {{CompatNo}} {{CompatNo}} 10 {{CompatNo}} {{CompatNo}}
Fonctionnalité Android Firefox Mobile (Gecko) Firefox OS IE Phone Opera Mobile Safari Mobile
Support simple {{CompatNo}} {{CompatNo}} {{CompatNo}} {{CompatVersionUnknown}} {{CompatNo}} {{CompatNo}}

Voir aussi