在網頁設計中，經常需要使用無序列表來展現一些信息，而有時我們又需要讓無序列表的元素橫向排列。這時，我們就需要使用CSS來設置無序列表的樣式。

<ul class="horizontal">
<li>元素1</li>
<li>元素2</li>
<li>元素3</li>
</ul>

我們可以使用以下CSS代碼來實現無序列表橫向排列：

ul.horizontal {
display: flex;
list-style: none;
}
ul.horizontal li {
margin-right: 10px;
}

我們可以解釋一下上述CSS代碼：

• display: flex;表示使用彈性布局，這使得無序列表的元素橫向排列。
• list-style: none;表示取消無序列表的默認樣式。
• margin-right: 10px;表示讓每個元素之間保留一個10像素的間距。

使用上述CSS代碼，我們就可以實現無序列表橫向排列的效果。

<style>
ul.horizontal {
display: flex;
list-style: none;
}
ul.horizontal li {
margin-right: 10px;
}
</style>
<ul class="horizontal">
<li>元素1</li>
<li>元素2</li>
<li>元素3</li>
</ul>