Sådan centrerer du en liste

Lær hvordan du bruger CSS til at centere lister.

centrer HTML-listen

Første trin - Tilføj HTML:

brug <ul> elementer indlejret i container-elementer, for eksempel <div>：

<div class="container">
  <ul class="myUL">
    <li>Kaffe</li>
    <li>Tee</li>
    <li>Cola</li>
  </ul>
</div>

Andet trin - Tilføj CSS:

brug <div> elementer centreret, og <ul> visning ændres til inline-block。

eller, du kan venstrejustere listeemner for at få en mere pæn visning:

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

Prøv det selv

Relaterede sider

Tutorial:CSS justering