Libellés pour les champs
Fait partie de la section Fondamentaux du Journey HTML de Coddy. Leçon 39 sur 60.
Il n’est pas toujours très clair de savoir à quoi correspond un champ de saisie sans libellé. Un libellé indique clairement aux utilisateurs quel type de saisie est attendu dans ce champ. Les libellés sont créés à l’aide de la balise <label>.
Voici la syntaxe de base :
<label for="field">Label text</label>
<input type="text" id="field"><label>: La balise qui crée l’étiquette.
for: Un lien entre l’étiquette et un champ de formulaire. La valeur defordoit correspondre à l’iddu champ de formulaire.
- Texte de l’étiquette : le texte qui décrit l’utilité du champ du formulaire.
<input>: Le champ de formulaire auquel l’étiquette fait référence.
id: L’identifiant unique du champ de formulaire, qui correspond à l’attributfordans le libellé.
Une fois liés, cliquer sur le texte du libellé place le curseur dans son champ de saisie (lui donne le focus), ce qui offre également aux utilisateurs une zone plus grande sur laquelle cliquer.
Défi
FacileAjoute les balises suivantes à l’intérieur de la balise <form> :
- Un
<label>avec le texte 'First Name:' et l’attributfordéfini sur 'firstname'. - Un champ
<input>avectype="text". - Le champ
<input>doit avoir unidqui correspond à l’attributfordu label.
Essayez vous-même
<!DOCTYPE html>
<html>
<body>
<form>
<!-- Écrivez le code ici -->
</form>
</body>
</html>
Testez-vousCette leçon comprend un petit quiz. Commencez la leçon pour y répondre et suivre votre progression.
Toutes les leçons de Fondamentaux
1Les bases du HTML
Qu'est-ce que le HTML ?Structure de base du HTMLBalises et élémentsImbrication et fermeture des balisesCommentaires en HTML7Page de profil personnel
Présentation du projetSection d'en-tête
Photo de profilSection À propos de moiLiens sociaux2Texte et mise en forme
TitresParagraphesSauts de ligneTexte en gras et italiqueGras et italique (suite)Récapitulatif - Mise en forme8Formulaires et champs de saisie, partie 1
Bases des formulairesChamps de texteAttributs des champsChamp de mot de passeLibellés pour les champsRécapitulatif - Formulaire de base11Page d'inscription à un événement
Aperçu du projetSection d'en-têteSection des détails de l'événementFormulaire d'inscriptionSection de pied de page3Travailler avec les listes
Liste non ordonnéeListe ordonnéeListes imbriquéesRécapitulatif - Les listes6Mise en page
DivisionsSpans en ligneBalises sémantiquesSections et articlesRécapitulatif - Mise en pageEntraînez-vous par vous-même : Playground Web