在網(wǎng)頁開發(fā)中，菜單欄是常見的常用組件之一。為菜單欄添加CSS可以讓其更加美觀，用戶體驗(yàn)也會變得更好。下面是關(guān)于如何給菜單欄加CSS的例子。

/* 定義菜單欄樣式 */
.menu {
background-color: #eee;
width: 100%;
line-height: 50px;
display: flex;
justify-content: center;
align-items: center;
}
/* 定義菜單項(xiàng)樣式 */
.menu-item {
margin: 0 10px;
padding: 0 10px;
cursor: pointer;
}
/* 定義菜單項(xiàng)懸停樣式 */
.menu-item:hover {
background-color: #ddd;
border-radius: 5px;
}
/* 定義當(dāng)前菜單項(xiàng)樣式 */
.current-menu-item {
background-color: #444;
color: #fff;
border-radius: 5px;
}
/* 定義當(dāng)前菜單項(xiàng)懸停樣式 */
.current-menu-item:hover {
background-color: #333;
}

上面的代碼中，我們定義了菜單欄樣式、菜單項(xiàng)樣式、菜單項(xiàng)懸停樣式、當(dāng)前菜單項(xiàng)樣式和當(dāng)前菜單項(xiàng)懸停樣式五個樣式。通過為菜單欄添加CSS樣式，可以讓其變得更加美觀，增加用戶體驗(yàn)。

可見，在網(wǎng)頁開發(fā)中使用CSS來美化菜單欄是一件非常值得嘗試的事情。只需要將上述代碼添加到CSS文件中或者在HTML文件的頭部添加一個CSS塊，然后將菜單欄的HTML代碼與CSS樣式相結(jié)合，就可以得到一個漂亮的菜單欄。