Sommaire

Les listes CSS POUR LE TEXTE:Listes

1. Les listes classiques

Bootstrap ne modifie pas le comportement des listes ordonnées (<ol>) et non ordonnées (<ul>). Bootstrap utilise juste la propriété margin pour uniformiser les marges.

ul, ol { 
   margin-top: 0; 
   margin-bottom: 10px; 
}

2. Les listes sans décoration

Bootstrap propose la classe .list-unstyled pour avoir une liste sans décoration (pas de numérotation ni de puce).

Exemple du code avec l’utilisation de cette classe dans la troisième liste :

<ul> 
   <li>Pomme</li> 
   <li>Fraise</li> 
   <li>Ananas</li> 
</ul> 
<ol> 
   <li>Pomme</li> 
   <li>Fraise</li> 
   <li>Ananas</li> 
</ol> 
<ul class="list-unstyled"> 
   <li>Pomme</li> 
   <li>Fraise</li> 
   <li>Ananas</li> 
</ul>

L’affichage des listes avec l’utilisation de l’élément <ul> pour la première, <ol> pour la deuxième et sans décoration pour la troisième :

images/C03-010.png

Les propriétés de la classe .list-unstyled :

.list-unstyled { 
   padding-left: 0; 
   list-style: none; 
}

3. Les listes en ligne

Bootstrap propose aussi la classe .list-inline pour afficher les items des listes les uns à côté ...