Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

label

Cet élément est utilisé pour fournit un label pour un élément de contrôle. Si l'utilisateur clique sur le label, le focus se placera sur le contrôle associé, tel que spécifié avec l'attribut control.

Pour plus d'informations, consultez le Tutoriel XUL.

Attributs
accesskey, control, crop, disabled, href, value
Propriétés
accessKey, accessibleType, control, crop, disabled, value
Classes de style
header, indent, monospace, plain, small-margin, text-link

Exemples

Image:XUL_ref_label.png
<label value="Email address" control="email"/>
<textbox id="email"/>

Attributs

accesskey
Type : caractère
Cet attribut doit être une lettre utilisée comme touche de raccourci. Cette lettre doit être un des caractères apparaissant dans l'attribut label de l'élément.

Exemple

Image:XUL_ref_accesskey_attr.png
<vbox>	
  <label value="Entrez votre nom" accesskey="e" control="myName"/>
  <textbox id="myName"/>
  <button label="Annuler" accesskey="n"/>
  <button label="OK" accesskey="O"/>
</vbox>

Voir également

Les attributs label et acceltext

crop
Type : une des valeurs ci-dessous
Si le label de l'élément est trop long pour être contenu dans son espace donné, le texte sera tronqué du côté indiqué par l'attribut crop. Une ellipse (…) sera utilisée à la place du texte tronqué. Si la direction de la boîte est inversée, le tronquage l'est également.
  • start : Le texte sera tronqué du côté gauche.
  • end : Le texte sera tronqué du côté droit.
  • left : Le texte sera tronqué du côté gauche.
  • right : Le texte sera tronqué du côté droit.
  • center : Le texte sera tronqué en son milieu, en affichant le début et la fin normalement.
  • none : Le texte ne sera pas tronqué avec une ellipse. Cependant il sera simplement coupé là où il est trop large. Le côté dépend de l'alignement CSS.
disabled
Type : booléen
Indique si l'élément est ou non désactivé. Si cette valeur est définie à true, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement command ne se déclenchera pas.


Image:XUL_ref_attr_disabled.png
<!-- La case à cocher active/désactive le bouton -->
<checkbox label="Enable button" 
    onclick="document.getElementById('buttRemove').disabled = this.checked"/>
<button id="buttRemove" label="Remove All" disabled="true"/>

Propriétés

accessKey
Type : caractère
Obtient et définit la valeur de l'attribut accesskey.


accessibleType
Type : entier
Une valeur indiquant le type d'objet d'accessibilité pour l'élément.
crop
Type : chaîne de caractères
Obtient et définit la valeur de l'attribut crop.
disabled
Type : booléen
Obtient et définit la valeur de l'attribut disabled.
value
Type : chaîne
Obtient et définit la valeur de l'attribut value.

Méthodes

Héritées de XUL element
blur, click, doCommand, focus, getElementsByAttribute

Héritées de DOM element
addEventListener(), appendChild(), dispatchEvent(), getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getElementsByTagName(), getElementsByTagNameNS(), hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isSupported(), normalize(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS()

Classes de style

Les classes suivantes peuvent être utilisées pour styler l'élément. Ces classes doivent être utilisées plutôt que de changer directement le style de l'élément, car elles s'intègreront plus naturellement dans le thème sélectionné par l'utilisateur.

header
A class used for headings. Typically, this will cause the text to appear bold.
indent
This class causes the text to be indented on its left side.
monospace
This class causes the text to be displayed in a monospace font.
plain
This class causes the element to be displayed with no border or margin.
small-margin
This class causes the text to be displayed with a smaller margin.
text-link
Labels with this class may be focused and the click handler run or the address in the href attribute opened on a mouse click or Enter key press. Labels will appear like a link (blue and underlined).

Sujets liés

Éléments
description
Attributs
label
Interfaces
nsIAccessibleProvider, nsIDOMXULLabelElement

Notes d'utilisation

N'oubliez pas que l'élément label a un attribut « value », contrairement au HTML où les boutons et cases à cocher utilisent label="valeur" comme attribut.

<label label="Une légende"/> <-- incorrect -->
<label value="Une légende"/>

<label value="Cliquez sur le bouton"/>
<button label="Un bouton"/>
<checkbox label="Une décision" value="1"/>

Étiquettes et contributeurs liés au document

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