### Attribut

Une balise n'est pas toujours suffisante pour caractériser un élément. On lui associe alors un ou plusieurs attributs qui vont apporter des précisions sur cet élément.

Un bon exemple est celui de la balise `<a>` qui permet de faire un lien sur un document externe. La balise en elle-même n'est pas suffisante car il manque (au moins) une information primordiale : l'adresse sur Internet du document à lier. De plus, cette adresse ne peut pas être fixée une fois pour toute car elle varie pour chaque lien différent que l'on voudra faire. On va donc utiliser un attribut (appelé dans ce cas `href`) et lui affecter une valeur correspondant au lien que l'on veut faire.

Un attribut est constitué par :

- un nom d'attribut,
- le caractère =
- une valeur.

Le nom des attributs n'est pas sensible à la casse et peut être écrit en minuscules, en majuscules ou dans un mélange des deux.
`href` est équivalent à `HREF` qui est équivalent à `Href` qui est équivalent à `HrEf`, etc.

La valeur d'un attribut peut :

Les guillemets sont obligatoires uniquement quand la valeur contient un ou plusieurs espaces, un ou plusieurs guillemets, un ou plusieurs caractères =.

- être entourée par des guillemets doubles
  `href="http://w3c.org"`
- être entourée par des guillemets simples
  `href='http://w3c.org'`
- ne pas être entourée par des guillemets
  `href=http://w3c.org`

Il peut y avoir plusieurs attributs dans une même balise.
La balise <img> accepte un attribut `src` qui permet de lier un fichier image à la page. Elle accepte aussi d'autres attributs comme par exemple `height` et `width` qui permettent de définir ses dimensions. L'exemple suivant montre comment ces attributs sont ajoutés.

Exemple : plusieurs attributs
<!DOCTYPE html> <html lang="fr"> <head> <meta charset="utf-8"> <title>Exemple de page</title> </head> <body> <p><img src="info.png" width="32" height="32"> avec les dimensions normales.</p> <p><img src="info.png" width="64" height="40"> avec d'autres dimensions, on obtient une image déformée.</p> </body> </html>

Les attributs utilisables varient suivant les balises. Dans les spécifications techniques ci-contre, vous aurez pour chaque élément les attributs permis et les valeurs attendues.

Certains attributs n'ont pas de valeur : ce sont des attributs booléens. Dans ce cas la présence de l'attribut dans la balise équivaut à la valeur `true` et l'absence de l'attribut équivaut à la valeur `false`. Il ne faut pas affecter de valeur `true` ou `false` (ou `0`, `1`, `on`, `off`, etc) à ce type d'attribut.

Dans l'exemple suivant, le 1er paragraphe a un attribut `hidden` qui va le cacher. Le 2eme paragraphe a un attribut `hidden="false"` et bien que la valeur soit `false`, le paragraphe est quand même caché.

Exemple : attribut booléen
<!DOCTYPE html> <html lang="fr"> <head> <meta charset="utf-8"> <title>Exemple de page</title> </head> <body> <p hidden>Je suis un exemple de document HTML.</p> <ul> <li>On utilise <strong>des balises</strong> pour marquer la structure du document.</li> <li>Les balises ont une <strong>syntaxe particulière</strong>.</li> <li>Elles permettent de donner du sens aux informations en définissant par exemple ici un paragraphe et une liste.</li> </ul> <p hidden="false">C'est le W3C qui définit les balises.</p> </body> </html>

Quelques attributs sont disponibles pour toutes les balises. Ce sont les attributs globaux (voir la liste dans les spécifications techniques de n'importe quel élément).