HTML
Élément d'étiquette

Syntaxe

• <label>Example <input type="radio" name="r"></label> // Envelopper un élément de contrôle
• <label for="rad1">Example</label> <input id="rad1" type="radio" name="r"> // Utilisation for attribut

Paramètres

Utilisation de base

Formulaire simple avec étiquettes ...

<form action="/login" method="POST">
    
    <label for="username">Username:</label>
    <input id="username" type="text" name="username" />

    <label for="pass">Password:</label>
    <input id="pass" type="password" name="pass" />

    <input type="submit" name="submit" />

</form>

<form id="my-form" action="/login" method="POST">
    
    <input id="username" type="text" name="username" />

    <label for="pass">Password:</label>
    <input id="pass" type="password" name="pass" />

    <input type="submit" name="submit" />

</form>

<label for="username" form="my-form">Username:</label>

A propos de l'étiquette

L'élément <label> est utilisé pour référencer un élément d'action de formulaire.
Dans le cadre de l'interface utilisateur, il est utilisé pour faciliter la sélection des éléments tels que Type radio ou checkbox .

<label> comme wrapper

Il peut contenir l'élément d'action souhaité

<label>
    <input type="checkbox" name="Cats">
    I like Cats!
</label>

(En cliquant sur le texte, l’ input cible basculera son état / valeur)

<label> comme référence

En utilisant l'attribut for vous n'avez pas besoin de placer l'élément de contrôle en tant que descendant de label - mais la valeur for doit correspondre à son identifiant

<input id="cats" type="checkbox" name="Cats">
<label for="cats" >I like Cats!</label>

Remarque
N'utilisez pas plus d'un élément de contrôle dans un élément <label>