導航欄是網站設計中常用的一種組件，可以幫助用戶快速找到需要的內容。在網站開發中，使用CSS樣式來制作導航欄可以使頁面更加美觀、清晰。下面就介紹一下如何用CSS樣式制作導航欄。

/*導航欄樣式*/
nav{
background-color: #333; /*背景色*/
color:#fff; /*文字顏色*/
height: 50px; /*高度*/
display: flex; /*設置為彈性盒子*/
justify-content: space-between; /*兩端對齊*/
align-items: center; /*垂直居中*/
}
/*導航項樣式*/
nav ul{
list-style: none; /*去掉列表標記*/
display: flex; /*設置為彈性盒子*/
justify-content: center; /*居中對齊*/
align-items: center; /*垂直居中*/
}
nav ul li{
margin-right: 20px; /*設置項之間的間距*/
}
nav ul li a{
text-decoration: none; /*去掉鏈接下劃線*/
color:#fff; /*鏈接顏色*/
}
/*當前導航項樣式*/
nav ul .current a{
font-weight: bold; /*當前項加粗*/
}

上面的代碼中，首先是對導航欄整體的樣式設置，設置背景色、文字顏色、高度等；然后對導航欄下的每個項進行樣式設置，設置為彈性盒子，并設置項之間的間距；最后設置當前選中項的樣式，加粗字體。

使用上述代碼樣式，結合HTML代碼如下：

使用CSS樣式制作導航欄可以輕松實現美觀清晰的效果，給用戶帶來更好的用戶體驗。