在網頁設計過程中，為了讓網頁看起來漂亮，我們需要使用 CSS 樣式來設置字體、顏色、邊框、背景等樣式，其中最常用的就是 CSS 樣式菜單。

ul{
margin: 0;
padding: 0;
list-style: none;
}
ul li{
float: left;
width: 100px;
height: 30px;
background-color: #ccc;
text-align: center;
line-height: 30px;
position: relative;
}
li ul{
display: none;
}
ul li a{
text-decoration: none;
color: #000000;
display: block;
}
ul li:hover{
background-color: #09f;
}
li:hover ul{
display: block;
position: absolute;
}
li:hover li{
float: none;
font-size: 14px;
}
li:hover a{
background-color: #ccc;
}
li:hover li:hover{
background-color: #09f;
}

上面是一個基本的 CSS 樣式菜單的代碼，其中 ul 代表無序列表，li 代表列表項，a 代表鏈接，每個 li 列表項需要設置寬度、高度、背景顏色、文字顏色、距離左邊的距離（float:left;），然后設置下拉菜單 ul 的 display:none;，當鼠標放到 li 上時，ul 的 display 屬性變為 block，這樣就可以顯示下拉菜單。同時，當鼠標放到 li 上時，設置背景顏色。最后，我們還需要設置下拉菜單的樣式，需要將它們的浮動屬性去掉，設置字體等屬性。

到此為止，我們已經了解了 CSS 樣式菜單的基本知識和代碼實現方式，相信你可以根據這個基礎來制作更加炫酷的下拉菜單。