<legend>

Description

L’élément <legend> est le premier enfant obligatoire de <fieldset>. Il fournit une description du groupe de contrôles, lue par les lecteurs d’écran avant chaque contrôle du groupe. Sans <legend>, le <fieldset> perd sa valeur sémantique et d’accessibilité.

Syntaxe

<fieldset>
  <legend>Coordonnées de contact</legend>
  <label for="email">Email :</label>
  <input type="email" id="email" name="email">
</fieldset>

Exemples

Légende pour un groupe de boutons radio :

<fieldset>
  <legend>Préférence de contact</legend>
  <label><input type="radio" name="contact" value="email"> Email</label>
  <label><input type="radio" name="contact" value="tel"> Téléphone</label>
  <label><input type="radio" name="contact" value="courrier"> Courrier</label>
</fieldset>

Notes

Doit être le premier enfant de <fieldset> : la spécification exige que <legend> soit le premier enfant de <fieldset>. Placer d’autres éléments avant <legend> est invalide.

Accessibilité : les lecteurs d’écran combinent le legend et le label pour annoncer chaque champ : par exemple, « Préférence de contact, Email, bouton radio ». Cela rend le contexte du groupe clair pour l’utilisateur.

Style : le legend est rendu par défaut en incrustation sur la bordure du fieldset. Il peut être repositionné ou stylisé librement avec CSS.