La balise HTML <ol> est utilisée pour représenter une liste ordonnée, aussi appelée liste numérotée. C'est ce que signifie l'acronyme 'ol', qui est l'abréviation de 'Ordered List'. Contrairement à la liste non ordonnée (<ul>), où les éléments de la liste sont marqués par des puces, avec la balise <ol>, chaque élément de la liste (<li>) est précédé d'un numéro, d'une lettre ou d'un autre type de compteur, indiquant un ordre particulier.
Voici un exemple d’utilisation de la balise <ol> :
<ol>
<li>Café</li>
<li>Thé</li>
<li>Lait</li>
</ol>
Cet extrait de code produira la liste suivante sur une page web :
Un des points essentiels à noter est que les balises <li> doivent être imbriquées à l'intérieur de la balise <ol>. Chaque balise <li> correspond à un élément de la liste.
De plus, HTML5 a introduit de nouveaux attributs pour la balise <ol>, dontstart et type. L'attribut start permet de spécifier le nombre à partir duquel la liste doit démarrer, tandis que l'attribut type définit le style de numérotation.
<ol start="50" type="I">
<li>Café</li>
<li>Thé</li>
<li>Lait</li>
</ol>
Cette liste commencera à partir du numéro 50 et utilisera des chiffres romains pour la numérotation.
L’utilisation de la balise <ol> est particulièrement appropriée lorsque l’ordre des éléments dans votre liste est important, par exemple, dans une liste d'instructions étape par étape, les recettes de cuisine ou le sommaire d’un livre.