CSS列表案例

ul {
list-style: none;
padding: 0;
}
li {
display: inline-block;
padding: 10px;
background-color: #f2f2f2;
border: 1px solid #ddd;
}
li:hover {
background-color: #ddd;
}

使用CSS樣式來美化列表，可以使網(wǎng)站更加美觀、易讀，下面是一個CSS列表的案例：

首頁
新聞
關(guān)于我們
聯(lián)系我們

在CSS中，我們可以使用list-style屬性來控制列表的樣式，padding屬性來控制每個列表項的內(nèi)邊距，border屬性來控制邊框。

在上述代碼中，我們設(shè)置了一個無序列表，將列表項的樣式去除，并將內(nèi)邊距設(shè)為10像素。當(dāng)鼠標(biāo)懸停在列表項上時，我們設(shè)置了一個背景色，從而增加了可讀性和用戶體驗。

另外，在實際開發(fā)中，列表的樣式也需要根據(jù)實際情況進行調(diào)整。例如，可以根據(jù)網(wǎng)站的整體風(fēng)格來設(shè)置背景色、邊框的顏色，也可以根據(jù)具體頁面的需求來調(diào)整每個列表項的樣式。