水平導航欄

水平導航欄是網頁中非常重要的一個元素，可以幫助用戶更方便地找到自己需要的內容。在H5中，我們可以用CSS代碼來實現一個簡單的水平導航欄。

CSS代碼示例：

/* 設置水平導航欄的樣式 */
nav {
display: flex; /* 使用flex布局 */
justify-content: space-around; /* 水平居中，均勻分布 */
background-color: #333; /* 設置導航欄背景色 */
color: #fff; /* 設置文本顏色 */
list-style: none; /* 取消列表樣式 */
margin: 0;
padding: 0;
}
/* 設置導航欄鏈接樣式 */
nav a {
text-decoration: none; /* 取消下劃線 */
color: #fff; /* 設置文本顏色 */
padding: 10px 20px; /* 設置內邊距 */
}
/* 設置鏈接在鼠標懸浮時的樣式 */
nav a:hover {
background-color: #eee; /* 設置背景色 */
color: #333; /* 設置文本顏色 */
}

HTML代碼示例：

<nav>
<ul>
<li><a href="#">首頁</a></li>
<li><a href="#">新聞</a></li>
<li><a href="#">娛樂</a></li>
<li><a href="#">體育</a></li>
<li><a href="#">科技</a></li>
</ul>
</nav>

通過以上CSS和HTML代碼，我們就可以構建出一個簡單的水平導航欄。通過修改CSS代碼，我們還可以調整導航欄的樣式，讓它更加符合我們自己的需求。希望以上內容對各位讀者有所幫助。