Attributs globaux
class, id, style, data-*, tabindex...
Imagine : tu construis ton immeuble et tu colles des étiquettes partout : “Appartement 3A”, “Escalier de secours”, “Accès interdit”. Les attributs globaux en HTML, c’est pareil : ce sont des infos que tu peux mettre sur (presque) toutes les balises pour mieux organiser ton plan et donner des indications précises.
10.1Les attributs les plus utiles
class: applique un style CSS (comme donner un rôle à plusieurs éléments)id: identifiant unique (comme une porte numérotée)style: ajoute un style directement dans la balise (à éviter, sauf dépannage rapide)data-*: range des infos personnalisées (ex.data-etage="2")hidden: cache l’élément (comme une pièce fermée au public)tabindex: définit l’ordre de navigation au clavier (comme un chemin de visite)contenteditable: rend un élément modifiable directement (comme écrire sur ton plan à la main)
<div id="hall" class="zone-principale">
<p style="color: red;">Texte temporaire (pas propre mais ça marche)</p>
<div data-etage="2">Appartement 2B</div>
<p hidden>Texte caché (comme une pièce secrète)</p>
<p tabindex="1">Première étape de navigation</p>
<p tabindex="2">Deuxième étape</p>
<div contenteditable="true">Écris directement ici</div>
</div>Astuce
Utilise class pour regrouper plusieurs éléments (comme donner le même uniforme à ton équipe). Réserve id aux cas uniques (un seul chef de chantier, pas dix ).