CSS列表橫排代碼怎么寫？

在CSS中，我們可以使用多種方法來實現(xiàn)列表的橫排顯示，以下是一種簡單的方法：

1、使用CSS的display屬性將列表項設置為inline或inline-block，這樣，列表項就會在一行內顯示，而不是默認的塊級元素。

2、如果需要，可以使用CSS的float屬性來使列表項浮動到左側或右側，這可以用來調整列表的對齊方式。

3、對于更復雜的布局需求，可以使用CSS的flex屬性來創(chuàng)建一個靈活的布局，其中列表項可以自動調整大小以適應容器的大小。

以下是一個簡單的示例代碼：

HTML代碼：

<ul>
  <li>列表項1</li>
  <li>列表項2</li>
  <li>列表項3</li>
  <li>列表項4</li>
  <li>列表項5</li>
  <li>列表項6</li>
  <li>列表項7</li>
  <li>列表項8</li>
  <li>列表項9</li>
  <li>列表項10</li>
</ul>

CSS代碼：

ul {
  display: flex; /* 使用flex布局 */
  justify-content: space-between; /* 列表項之間保持一定距離 */
}
li {
  flex: 1; /* 列表項自動調整大小以適應容器大小 */
  margin: 0 10px; /* 列表項之間的間隔距離 */
}

在這個示例中，我們使用了CSS的flex布局來創(chuàng)建了一個靈活的容器，其中列表項可以自動調整大小以適應容器的大小，我們還使用了justify-content屬性來使列表項之間保持一定的距離，通過給每個列表項添加一定的間隔距離，我們可以得到一個整齊、清晰的橫排列表。