Les listes à puces

23.06.2014

Nous allons désormais voir les listes à puces.

Je suis sûre que vous en avez déjà vu sur des sites, ou même sur un traitement de texte !

Les listes à puces sont des listes soit comme ceci:

Soit numérotée comme cela:

Les listes non-numérotées:

Pour les listes non-numérotées, on utilise la balise <ul></ul> de type inline.

Et à l'intérieur de celle-ci, pour chaque élément de notre listes, on l'encadre par les balise <li></li>.

Imaginons un liste de course, voilà ce que cela donnerais:

<ul>

<li>Fromage</li>

<li>Pates</li>

<li>Fruits</li>

</ul>

Notez que par défaut, un listes à puce met des point devant les éléments, nous pourront remédier à cela avec le CSS !

Les listes numérotées:

Pour les listes numérotées, c'est la même technique, sauf que l'on remplace <ul></ul> pour <ol></ol>.

Prenons le même exemple que tout à l'heure :

<ol>

<li>Fromage</li>

<li>Pates</li>

<li>Fruits</li>

</ol>

Voilà ! Vous savez maintenant créer des listes à puces !