Balise (Tag)

En HTML, une balise est une instruction qui indique au navigateur comment afficher un contenu.

Elle est toujours entourée de chevrons < >.

1
<p>Bonjour</p>

DéfinitionLa structure générale

Une balise HTML peut se décomposer en trois parties :

1
<nom_de_balise>contenu</nom_de_balise>

  • <nom_de_balise> → la balise ouvrante

  • contenu → ce qui apparaît dans la page

  • </nom_de_balise> → la balise fermante

DéfinitionBalises auto-fermantes

On trouve aussi des balises sans contenu, dites vides. Elles servent uniquement à donner une instruction au navigateur (par exemple insérer une image ou forcer un saut de ligne). Elles s’écrivent en une seule balise, et peuvent se terminer par un slash (/), mais ce dernier reste optionnel en HTML5.

1
<img />
2
<br />
3
<hr />

DéfinitionArborescence

Une balise peut contenir d’autres balises : on parle alors d’une structure hiérarchique ou arborescente.

Dans cette arborescence, on distingue les notions de parent, enfant et frère (sibling).

1
<div>
2
  <p>premier paragraphe</p>
3
  <p>deuxième paragraphe en <abbr>HTML</abbr></p>
4
</div>

  • La balise <div> est le parent des deux balises <p>.

  • Les deux balises <p> sont les enfants du <div>.

  • La balise <abbr> est l’enfant du deuxième <p>, qui devient donc son parent.

  • Les deux balises <p> sont dites frères (siblings) car elles partagent le même parent.

AttentionPas de croisement

Les balises ne doivent pas se croiser. Lorsqu’une balise est ouverte à l’intérieur d’une autre, elle doit être refermée avant la fermeture de sa balise parente.

1
<p>Bonjour <i>à</p> tous</i>

Dans ce cas, on ne sait pas qui est le parent qui est l'enfant, le navigateur non plus.