手風琴下拉菜單是網站設計中經常使用的一種菜單形式。通過加載CSS，可以輕松地設計一個漂亮的手風琴下拉菜單。下面是一個簡單的CSS代碼示例，讓我們一起來看看：

ul {
list-style-type: none;
margin: 0;
padding: 0;
width: 200px;
background-color: #f1f1f1;
}
li a {
display: block;
color: #000;
padding: 8px 16px;
text-decoration: none;
font-size: 18px;
font-weight: bold;
}
li a:hover {
background-color: #555;
color: white;
}
li.active a {
background-color: #555;
color: white;
}
li:after {
content: '\002B';
color: #777;
float: right;
margin-left: 5px;
}
li.active:after {
content: '\2212';
}
li.active >ul {
display: block;
}
ul ul {
display: none;
list-style-type: none;
margin: 0;
padding: 0;
}
ul ul li a {
display: block;
color: #777;
padding: 8px 16px;
text-decoration: none;
font-size: 16px;
font-weight: normal;
}
ul ul li a:hover {
background-color: #f1f1f1;
}

通過這段CSS代碼，我們可以為網站設計一個簡單、美觀的手風琴下拉菜單，實現用戶友好的導航功能。當然，這只是一個簡單的示例，你可以更改CSS的屬性值來調整菜單的樣式，以適應你的網站設計需求。