CSS是網頁設計中一個不可或缺的工具，在網頁設計中，使用CSS可以讓網頁呈現出想要的樣式。而列表是一個很常見的元素，排列方式也有很多種。下面我們來講一講CSS列表的水平排列。

<ul>
<li>列表項1</li>
<li>列表項2</li>
<li>列表項3</li>
</ul>

以上是一個典型的無序列表，每一項豎直排列。如果想要讓它們橫向排列，則需要使用CSS代碼。

ul {
list-style: none; /*去掉列表項的符號*/
margin: 0;
padding: 0;
display: flex; /*將列表項變為彈性盒子*/
}
li {
margin-right: 20px; /*為每一項添加右邊距離*/
}

以上是一個比較簡單的CSS代碼，它將列表項的容器（<ul>）變為一個彈性盒子，從而使得列表項橫向排列。同時，為每一項添加了右邊距離，以避免列表項挨在一起。

另外，還可以使用CSS的偽類選擇器來為列表項添加一些鼠標懸停或點擊后的效果。例如：

li:hover {
color: red;
cursor: pointer;
}
li:active {
transform: scale(1.1);
}

以上代碼為列表項添加了懸停變紅和點擊后放大的效果。

總的來說，使用CSS可以很方便地實現列表橫向排列，并且可以通過偽類選擇器為列表項添加一些交互效果，豐富網頁設計。