HTML 是 Web 開發(fā)中常用的一種標(biāo)記語(yǔ)言，而展開菜單則是網(wǎng)頁(yè)設(shè)計(jì)中非常常見和實(shí)用的一個(gè)功能。 展開菜單的實(shí)現(xiàn)可以使用一些 HTML 元素和 CSS 樣式，其中最常用的就是 ul 和 li 元素和 CSS 中的 hover 偽類。在 ul 元素中，使用 li 元素作為菜單項(xiàng)，將它們用 ul 包裹起來，再使用 CSS 中的 display:none; 將菜單項(xiàng)的子菜單隱藏起來。當(dāng)鼠標(biāo)移動(dòng)到菜單項(xiàng)上方時(shí)，使用 hover 偽類將其子菜單的 display 屬性設(shè)置為 block 或者 inline-block，從而實(shí)現(xiàn)菜單的展開和收起。 下面是一個(gè)基本的 HTML 展開菜單代碼：

這是一個(gè)展開菜單的例子：
菜單1
子菜單1
子菜單2
菜單2
子菜單1
子菜單2
菜單3
子菜單1
子菜單2

在上面的代碼中，我們首先使用樣式清理了 ul 和 li 元素的默認(rèn)樣式，并將 li 元素的 position 屬性設(shè)置為 relative，這是為了方便將子菜單相對(duì)于其父菜單進(jìn)行定位。然后，在 ul 元素下嵌套了一個(gè) ul 元素，它用來顯示子菜單，并將其 display 屬性設(shè)置為 none，以隱藏子菜單。 接著，在 li:hover >ul 的 CSS 選擇器中，我們使用了 >符號(hào)來選中所有擁有 hover 狀態(tài)的 li 元素的后代 ul 元素，并將其 display 屬性設(shè)置為 block 或 inline-block，這樣就可以在鼠標(biāo)移動(dòng)到菜單項(xiàng)上時(shí)，將子菜單展開。 在 HTML 展開菜單的代碼中，我們使用 pre 標(biāo)簽來包含整個(gè)代碼片段，這樣可以避免代碼在瀏覽器中的自動(dòng)格式化，保證展現(xiàn)的最佳效果。