在使用 CSS 樣式設計列表時，可以通過選擇合適的樣式來讓列表更加美觀、易讀和易用。以下是幾種常見的列表樣式選擇： 1. 無序列表樣式 無序列表是指列表項沒有固定的序號或編號，可以使用以下 CSS 樣式來美化： ``` ul { list-style: none; /* 去掉默認樣式 */ margin-left: 0; /* 去掉默認縮進 */ padding-left: 20px; /* 添加左側縮進 */ } ul li:before { content: "?"; /* 定義項目符號 */ margin-right: 10px; /* 加入右側留白 */ } ``` 以上代碼的效果是將無序列表項前面的默認符號（實心圓點）替換成一個小圓點，并加入左側縮進和右側留白。 2. 有序列表樣式 有序列表是指列表項有固定的序號或編號，可以使用以下 CSS 樣式來美化： ``` ol { list-style: none; /* 去掉默認序號 */ counter-reset: num; /* 重新計數器 */ } ol li { counter-increment: num; /* 計數器自增 */ } ol li::before { content: counter(num) ". "; /* 計數器值加上序號符號 */ margin-right: 10px; /* 加入右側留白 */ } ``` 以上代碼的效果是給有序列表項添加一個自定義的序號，并加入右側留白。 3. 列表項懸浮樣式 在列表中，當鼠標懸浮在某個列表項上時，可以添加一些樣式來提高用戶的交互體驗，例如： ``` li:hover { background-color: #f0f0f0; /* 添加背景色 */ box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1); /* 添加陰影效果 */ } ``` 以上代碼的效果是在鼠標懸浮在列表項上時，給這個列表項添加一個淺灰色的背景色，并在下方添加一個淡淡的陰影效果。 綜上所述，通過選擇合適的列表樣式，可以將列表項更加美觀，易讀和易用，進而提升網站的用戶體驗。