Comment centrer une liste

Apprenez à centrer une liste à l'aide de CSS.

liste centrée

  • Café
  • Thé
  • Cola

centrer la liste HTML

Première étape - Ajouter HTML :

placez <ul> les éléments sont enveloppés dans un élément conteneur, par exemple <div>:

<div class="container">
  <ul class="myUL">
    <li>Café</li>
    <li>Thé</li>
    <li>Cola</li>
  </ul>
</div>

Deuxième étape - Ajouter CSS :

placez <div> les éléments sont centrés horizontalement, et <ul> de l'affichage est modifié en inline-block。

ou, vous pouvez aligner à gauche les éléments de la liste pour obtenir une vue plus ordonnée :

div.container {
  text-align: center;
{}
ul.myUL {
  display: inline-block;
  text-align: left;
{}

Essayer personnellement

Pages liées

Tutoriel :Alignement CSS