在 Web 開(kāi)發(fā)中，下拉菜單是常見(jiàn)的網(wǎng)頁(yè)元素。當(dāng)用戶懸停在下拉菜單上時(shí)，會(huì)出現(xiàn)一個(gè)下拉菜單，以供用戶選擇

CSS和JavaScript都可以實(shí)現(xiàn)下拉菜單效果。以下是一個(gè)使用CSS實(shí)現(xiàn)的下拉菜單代碼示例：

.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
z-index: 1;
}
.dropdown:hover .dropdown-content {
display: block;
}

上面的代碼中，我們首先創(chuàng)建了一個(gè)容器，使用position: relative;設(shè)置為相對(duì)定位，并通過(guò)display: inline-block;來(lái)使得該容器內(nèi)部的內(nèi)容水平排列。

在容器內(nèi)部，我們又創(chuàng)建了一個(gè)下拉菜單，使用display: none;來(lái)隱藏該元素，并通過(guò)position:absolute;和z-index:1;來(lái)設(shè)置該元素在容器內(nèi)部的位置和層級(jí)關(guān)系。

最后，我們使用:hover偽類(lèi)選擇器來(lái)實(shí)現(xiàn)了該下拉菜單的懸停效果。當(dāng)用戶鼠標(biāo)懸停在容器上時(shí)，下拉菜單的display屬性被設(shè)置為block;從而顯示該元素