菜單欄下拉是網頁制作中非常常見的一種效果，它可以方便用戶在頁面中快速切換不同的內容。下面我們來分享一下如何使用 CSS 實現菜單欄下拉。

.nav {
position: relative;
}
.dropdown {
position: absolute;
display: none;
top: 100%;
left: 0;
z-index: 999;
}
.nav:hover .dropdown {
display: block;
}

在上述 CSS 代碼中，我們首先為菜單欄容器添加了相對定位（position: relative），然后定義了一個下拉容器（dropdown），它的位置為絕對定位，并設置了 z-index 值為 999，確保它在其他元素之上。

接下來，在菜單欄容器上添加了一個 hover 事件（:hover），當用戶鼠標移動到菜單欄上時，下拉容器就會顯示（display: block）。

需要注意的是，在實際使用中，我們需要合理調整下拉容器的樣式，例如設置它的寬度、背景色、邊框等，以便與菜單欄相適應。

以上就是使用 CSS 實現菜單欄下拉的基本步驟，希望能夠幫助到大家。