CSS 折疊菜單欄是一個非常實用的功能，它通過簡單的HTML和CSS代碼實現了一種能夠展開和折疊的多極菜單。這種菜單欄能夠幫助網站實現更好的頁面結構和布局，使網站變得更加美觀和易用。
/* CSS代碼 */
/* 隱藏菜單項 */
.menu-item {
display: none;
}
/* 切換菜單展開和折疊狀態 */
.menu-toggle:checked + .menu {
display: block;
}
/* 定義菜單項層級 */
.menu-item {
margin-left: 20px;
}
/* 定義菜單基本樣式 */
.menu {
display: none;
list-style: none;
padding: 0;
margin: 0;
}
/* 定義菜單頭部樣式 */
.menu-header {
font-weight: bold;
cursor: pointer;
}
/* 定義菜單鏈接樣式 */
.menu-link {
display: block;
}上述代碼中，我們通過設置菜單鏈接的input元素的checked屬性實現了菜單的展開和折疊。同時，我們也設置了一些基本樣式和功能，如隱藏菜單項、定義層級和樣式等等。
在HTML中，我們可以使用ul和li元素來編寫折疊菜單欄。以下是一個簡單的示例：
在這段HTML代碼中，我們使用了ul和li元素來編寫一個簡單的折疊菜單欄。在菜單項中，我們用a元素來定義鏈接。通過設置input元素的id和label元素的for屬性，我們可以實現對菜單的控制。同時，我們也對菜單項進行了層級設置，使得菜單更加美觀。
總之，CSS 折疊菜單欄是一種非常實用的功能，能夠幫助我們實現更好的頁面結構和布局。通過簡單的HTML和CSS代碼，我們就可以創造出一個美觀、易用的多極菜單，為網站提供更好的用戶體驗。