CSS導航欄橫放是網站設計中很重要的一部分。它可以使用戶輕松地在網站上瀏覽不同頁面，而不必跳轉到其他頁面。在本文中，我們將使用CSS創建一個簡單的導航欄。

<style>
.nav{
display: flex;  //使用彈性盒子讓導航欄橫向排列
justify-content: center;  //讓導航欄居中
background-color: #333;  //導航欄背景色
padding: 10px 20px;  //添加內邊距
}
.nav a{
color: white;  //導航鏈接顏色
text-decoration: none;  //導航鏈接無下劃線
margin: 0 20px;  //導航鏈接間距
}
</style>
<div class="nav">
<a href="#">首頁</a>
<a href="#">產品</a>
<a href="#">服務</a>
<a href="#">關于我們</a>
<a href="#">聯系我們</a>
</div>

上述代碼首先定義了一個class為“nav”的div，在這個div中包含了導航鏈接。接下來，我們使用display屬性將導航欄設置為彈性盒子。這樣，我們就可以使用justify-content屬性在水平方向上使導航欄居中了。我們還定義了一個背景顏色和內邊距來增強導航欄的可讀性。

在鏈接的樣式中，我們設置了鏈接顏色和間距，并去除了下劃線。這使得鏈接看起來更加清晰，易于訪問。

總的來說，CSS導航欄的橫向排列使得用戶更方便地訪問網站的其他頁面。使用flex和其他CSS技巧，我們可以輕松地創建漂亮的導航欄。