CSS 列表li橫向滑動是一個常見的 Web 開發需求。在這篇文章中，我們將介紹如何使用 CSS 實現此功能。

首先，我們創建一個包含多個li元素的 HTML 列表。以下是一個簡單的示例：

<ul class="slider">
<li>Slide 1</li>
<li>Slide 2</li>
<li>Slide 3</li>
<li>Slide 4</li>
<li>Slide 5</li>
</ul>

我們將使用 CSS 的display和overflow屬性創建橫向滑動。具體來說，我們將把ul元素的display屬性設置為flex，并將overflow-x屬性設置為scroll。這樣，在內容超出容器寬度時，就可以創建水平滾動條。同時，還需要將li元素的width屬性設置為相同的值，以確保每個元素在滾動時具有相同的寬度。

.slider {
display: flex;
overflow-x: scroll;
}
.slider li {
width: 200px;
}

我們還可以添加其他 CSS 樣式，例如設置背景顏色、文本樣式和邊框。

.slider {
display: flex;
overflow-x: scroll;
background-color: #f2f2f2;
padding: 10px;
border: 1px solid #ddd;
}
.slider li {
width: 200px;
background-color: #fff;
text-align: center;
padding: 20px;
margin-right: 10px;
border-radius: 5px;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
}

在這里，我們設置了一個白色背景、文本居中、邊框半徑為 5 像素，盒子陰影為 0 2px 3px rgba(0, 0, 0, 0.1)。

最后，我們將通過使用 JavaScript 或庫（如 jQuery）為滑塊添加動畫效果（例如，點擊箭頭向左或向右滾動）。

以上是一個簡單的實現 CSS 列表li橫向滑動的方法。您可以根據實際需要自定義樣式和功能。