Id en HTML
Après class, id nomme un seul élément.
Pourquoi les noms uniques comptent
Les sauts attendent une seule correspondance.
Réponse directe
id="faq" une fois. href="#faq". CSS #faq. Pas id="#faq". Pour un style partagé, class.
📊 id versus class
| Feature | id | class |
|---|---|---|
| Uniqueness | One per page (ideally) | Many elements may share |
| HTML attribute | id="faq" (no #) | class="tip" (no .) |
| CSS selector | #faq | .tip |
| Common uses | Bookmarks, unique hooks, script targets | Reusable styles and groups |
Lien fragment vers un titre
Lien en haut, id plus bas.
Unique id and fragment link
html<p><a href="#faq">Jump to FAQ</a></p>
<h2 id="faq">FAQ</h2>
<p>Answers go here.</p>
Lecture du fragment
-
seulement dans le lien
- nom nu dans l’attribut
Crochet CSS unique avec #id
Un panneau — avec parcimonie.
Unique id with CSS
html<div id="promo">
<h2>Limited offer</h2>
<p>One panel, one unique hook.</p>
</div>
<style>
#promo { border: 2px solid #0a7; padding: 12px; }
</style>
Lecture du style unique
-
promo en CSS
- pas de # dans l’attribut
Choisir id ou class
Plusieurs éléments ? class. Une cible ? id.
Pratique
- titre avec id
- lien # et sauter
- supprimer les doublons
- class pour les tips
Erreurs faciles
- id en double
-
dans l’attribut
- id pour chaque style partagé
Résumé
- id unique
-
dans href/CSS
- class pour partager
🧠 Testez Vos Connaissances
Testez Vos Connaissances
Mettez-vous au défi avec ce quiz interactif et voyez à quel point vous comprenez le sujet
📝 Instructions
- Lisez chaque question attentivement
- Sélectionnez la meilleure réponse pour chaque question
- Vous pouvez refaire le quiz autant de fois que vous le souhaitez
- Votre progression sera affichée en haut