如何居中列表

學習如何使用 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;
}