CSS中如何設(shè)置ul

ul {
list-style: none; /*去掉ul前面的默認(rèn)符號(hào)*/
margin: 0;
padding: 0;
}
ul li {
padding: 10px; /*設(shè)置每個(gè)li的內(nèi)邊距*/
border-bottom: 1px solid #ccc; /*設(shè)置每個(gè)li的下邊框*/
}
ul li:last-child {
border-bottom: none; /*去掉最后一個(gè)li的下邊框*/
}
ul li a {
text-decoration: none; /*去掉a標(biāo)簽的下劃線*/
color: #333; /*設(shè)置字體顏色*/
display: block; /*將a標(biāo)簽轉(zhuǎn)換為塊級(jí)元素，使它充滿整個(gè)li的區(qū)域*/
}
ul li a:hover {
background-color: #f4f4f4; /*鼠標(biāo)懸停時(shí)改變背景顏色*/
}

解釋：

我們首先設(shè)置ul的樣式，去掉ul前面的默認(rèn)符號(hào)，并且把ul的外邊距和內(nèi)邊距都設(shè)為0。接著，我們?yōu)閡l中的每個(gè)li元素設(shè)定樣式，給它們添加內(nèi)邊距和下邊框，并且去掉最后一個(gè)li的下邊框。我們讓li內(nèi)的a標(biāo)簽轉(zhuǎn)換為塊級(jí)元素，使它充滿整個(gè)li的區(qū)域。然后我們?yōu)閍標(biāo)簽添加樣式，去掉下劃線并且設(shè)置字體顏色。最后，我們?cè)谑髽?biāo)懸停時(shí)改變li的背景顏色。