HTML網頁中，導航欄是非常重要的一部分，它可以幫助用戶更快捷地訪問到網站的各個頁面。其中，橫向導航欄是較為常用的一種。 下面，我們來看一下如何使用HTML代碼實現橫向導航欄。首先，在HTML文件中添加一個導航欄的區域：

<nav>
</nav>

在這個區域中，我們可以添加一些鏈接，這些鏈接可以是其他頁面、外部鏈接或者是錨點。鏈接的格式如下：

<a href="鏈接地址">鏈接文字</a>

然后，我們在nav標簽中添加幾個鏈接，形成一個簡單的導航：

<nav>
<a href="#">首頁</a>
<a href="#">產品介紹</a>
<a href="#">新聞資訊</a>
<a href="#">聯系我們</a>
</nav>

這個導航欄中，我們分別添加了“首頁”、“產品介紹”、“新聞資訊”和“聯系我們”四個鏈接。在實際項目中，我們可以根據需要添加或者刪除鏈接。 以上是橫向導航欄的基本實現過程，下面我們再來添加一些CSS樣式，讓導航更加美觀。 首先，我們可以將nav標簽的display屬性設置為“flex”，讓導航欄變成一個橫向排列的排列方式：

<nav style="display: flex;">
...
</nav>

然后，我們可以添加一些鼠標懸停時的效果，讓導航看起來更加生動：

<nav style="display: flex;">
<a href="#">首頁</a>
<a href="#">產品介紹</a>
<a href="#">新聞資訊</a>
<a href="#">聯系我們</a>
</nav>
<style>
nav a:hover {
color: red; /* 改變字體顏色 */
background-color: #eee; /* 改變背景顏色 */
border-bottom: 2px solid red; /* 添加底部邊框 */
}
</style>
通過以上CSS樣式的添加，我們就可以讓導航欄變得更加美觀了。當然，在實際項目中，我們還可以添加很多其他的效果，比如字體大小、字體樣式、背景顏色等等。
總結來說，橫向導航欄是網頁設計中非常重要的一部分，而HTML和CSS技術是實現導航欄的基礎。在實際項目中，我們需要根據需求不斷地優化導航欄的樣式和功能，以便更好地服務于用戶。