如何居中列表

学习如何使用 CSS 将列表居中。

居中的列表

将 <ul> 元素包裹在容器元素内，例如 <div>：

<div class="container">
  <ul class="myUL">
    <li>咖啡</li>
    <li>茶</li>
    <li>可乐</li>
  </ul>
</div>

将 <div> 元素居中对齐，并将 <ul> 的显示更改为 inline-block。

或者，您可以左对齐列表项以获得更整洁的视图：

div.container {
  text-align: center;
}

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