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>