attributs globaux¶
Les attributs globaux sont des attributs susceptibles d’être appliqués à n’importe quelle balise. La spécification en indique 12. Cependant, les deux attributs globaux les plus courants sont les suivants :
id¶
l’attribut id permet de définir un identificateur unique pour un élément. Il permet notamment de sauter directement à une partie spécifique du document grâce à un lien hypertexte.
Les valeur d’id ne sont pas définies par la spécification HTML. On tentera autant que possible d’indiquer un id qui nous renseigne sur l’élément sur lequel il est appliqué.
Il s’agit d’un attribut unique, qui ne peut être attribué qu’une seule fois.
<section id="exemple-d-id">contenu<section>
<a href="#exemple-d-id">lien vers l’exemple</a>
Note
Ici on définit un élément section avec l’identifiant unique
exemple-d-id
l’élément a (pour anchor, ancre) est un lien qui renvoit vers
l’adresse indiquée via son attribut href (pour Hypertexte
REFerence). Ici, il renverra vers l’élément donc l’id sera
exemple-d-id.
Class¶
l’attribut class permet de définir un ou plusieurs identificateurs,
séparées par des espaces, et permettant d’indiquer les classes (on
pourrait dire les groupes) auxquelles l’élément appartient.
Les valeurs de class ne sont pas définies par la spécification HTML.
On tentera autant que possible d’indiquer des valeurs de class qui
nous renseignent sur l’élément sur lequel elles sont appliquées.
<button class="bouton--suppression grandes-marges avertissement">supprimer les fichiers</a>
Note
Le principal usage des classes est de permettre la sélection, en CSS, des éléments, afin de pouvoir indiquer comment ceux-ci doivent apparaître.
attributs style¶
l’attribut style est un attribut global qui peut être utilisé pour
associer des propriétés CSS de mise en forme directement dans le HTML.
Avertissement
Cela constitue toutefois une entorse au principe de séparation des préoccupations. C’est quelque chose que l’on souhaite ardemment éviter, il est donc préférable d’avoir une très bonne justification pour insérer directement dans son code source des propriétés CSS via cet attribut.
<p style="color:red;">paragraphe</p>