MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

L'élément HTML <label> représente une légende pour un objet d'une interface utilisateur. Il peut être associé à un contrôle en utilisant l'attribut for ou en plaçant l'élément du contrôle à l'intérieur de l'élément <label>. Un tel contrôle est appelé contrôle étiqueté par l'élément <label>.

Catégories de contenu Contenu de flux, contenu phrasé, contenu associé aux formulaires (listed, submittable, resettable), contenu tangible, contenu interactif.
Contenu autorisé Contenu phrasé sans éléments label descendants. À l'exception du contrôle lié à la légende, pas d'autres éléments pouvant contenir un élément label.
Omission de balise Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires
Parents autorisés Tout élément acceptant du contenu phrasé.
Rôles ARIA autorisés Aucun.
Interface DOM HTMLLabelElement

Attributs

Cet élément inclut les attributs universels.

for
L'identifiant de l'élément de formulaire associé, appartenant au même document que l'élément label. Le premier élément du document dont l'identifiant correspond est alors le contrôle étiqueté par l'élément.
Note : Un élément label peut simultanément avoir un attribut for et contenir un élément de contrôle tant que l'attribut for pointe vers l'élément contenu.

Attributs obsolètes

form HTML5
L'élément de formulaire auquel l'élément label est associé (son formulaire propriétaire). La valeur de cet attribut doit être l'identifiant d'un élément <form> contenu au sein du même document. Si l'attribut n'est pas renseigné, cet élément <label> doit être le descendant d'un élément <form>. Cet attribut permet de placer des éléments label dans le document sans qu'ils soient nécessairement imbriqués dans un formulaire.
Note : La spécification HTML a été mise à jour le 28 avril 2016 afin de déprécier l'attribut form. Celui-ci est toujours disponible dans les scripts mais sa définition a changé, il renvoie désormais le contrôle associé au formulaire ou null s'il n'y a pas de contrôle associé (autrement dit si HTMLLabelElement.control vaut null).

Exemples

Exemple simple

HTML

<label>Cliquez ici<input type="text" id="Utilisateur" name="Nom" /></label>

Résultat

Utiliser l'attribut for

HTML

<label for="Utilisateur">Cliquez ici</label>
<input type="text" id="Utilisateur" name="Nom" />

Résultat

Spécifications

Spécification État Commentaires
WHATWG HTML Living Standard
La définition de '<label>' dans cette spécification.
Standard évolutif  
HTML5
La définition de '<label>' dans cette spécification.
Recommendation  
HTML 4.01 Specification
La définition de '<label>' dans cette spécification.
Recommendation Définition initiale.

Compatibilité des navigateurs

Fonctionnalité Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Support simple (Oui) (Oui) (Oui)[1][2] (Oui) (Oui) (Oui)
Fonctionnalité Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support simple (Oui) (Oui) (Oui)[1][2] (Oui) (Oui) (Oui)

[1] À partir de Gecko 8.0 (Firefox 8.0 / Thunderbird 8.0 / SeaMonkey 2.5), lorsqu'un évènement de clic bouillonne au plus sur un seul élément <label>, un évènement de clic artificiel ne peut pas déclencher d'autres <label>. Dans Gecko, un évènement de clic se propagera toujours après un élément <label> alors que pour WebKit ou Internet Explorer, l'évènement de clic s'arrêtera à l'élément <label>. Avant Gecko 8.0 (lorsque plusieurs <label> étaient déclenché), Firefox ne répondait plus suite à l'évènement (cf. bug 646157).

[2] La spécification HTML a été mise à jour en avril 2016 afin de déprécier l'attribut form. Celui-ci est toujours disponible dans les scripts mais sa définition a changé, il renvoie désormais le contrôle associé au formulaire ou null s'il n'y a pas de contrôle associé (autrement dit si HTMLLabelElement.control vaut null) (voir l'interface HTMLLabelElement.form pour plus de détails). Cette modification a été implémentée dans Firefox 49.

Voir aussi

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : SphinxKnight, marie-ototoi, tregagnon, teoli
 Dernière mise à jour par : SphinxKnight,