HTML和CSS是網頁設計的兩個重要組成部分，其中導航菜單是一個重要的設計元素。導航菜單不僅可以幫助用戶快速找到所需內容，還可以增加網頁的美觀程度。 在HTML中，導航菜單通常使用無序列表實現。下面是一個簡單的HTML導航菜單代碼：

<ul>
<li><a href="index.html">首頁</a></li>
<li><a href="news.html">新聞</a></li>
<li><a href="about.html">關于我們</a></li>
<li><a href="contact.html">聯系我們</a></li>
</ul>

在CSS中，我們可以通過樣式規則來添加樣式以美化導航菜單。例如，我們可以為導航菜單項設置背景顏色、文本顏色等。下面是一個簡單的CSS樣式規則示例：

ul {
list-style: none;
margin: 0;
padding: 0;
}
li {
display: inline-block;
margin-right: 20px;
}
a {
display: block;
padding: 10px;
background-color: #ccc;
color: #fff;
text-decoration: none;
}
a:hover {
background-color: #666;
}

在這個樣式規則中，我們首先將無序列表的樣式重置為0，并設置列表項為橫向顯示，同時設置每個列表項之間的間距為20像素。接著，我們為鏈接設置了背景顏色、文本顏色和邊距等樣式。最后，我們為鏈接的hover狀態設置了不同的背景顏色。 總之，HTML和CSS的導航菜單代碼可以大大提升網頁設計的質量。通過簡單的代碼和樣式設置，我們可以創建一個美觀、易于使用的導航菜單，讓用戶更輕松地查找所需內容。