當前位置：首頁 > 前端技术 > CSS >内容正文

CSS

CSS设置列表的符号

發(fā)布時間：2025/3/20 CSS 42 豆豆

生活随笔收集整理的這篇文章主要介紹了 CSS设置列表的符号小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

CSS設置列表的符號

? ? ? ? ? 通常的列表采用<ul>或者<ol>標記，然后，結合<li>標記羅列各個項目。

項目表單實例，代碼如下：

<span style="font-size:24px;"><html><head><title>項目列表</title><style></style></head> <body><p>水上運動</p><ul><li>freestyle自由泳</li><li>backstroke仰泳</li><li>breaststroke蛙泳</li><li>butterfly蝶泳</li><li>individualmedley 個人混合泳</li><li>freestylerelay 自由泳接力</li></ul></body> </html></span> ? ? ? ? ??CSS通過list-style-type屬性設置列表的編號，無論是<ul>標記，還是<ol>標記都可以使用相同的屬性值，二者的效果完全相同。

<span style="font-size:24px;">ul{font-size:0.9em;color:#00458c;list-style-type:decimal;}</span> ? ? ? ? ??Decimal屬性值，項目列表的編號安裝十進制編號顯示。

? ? ? ? ??當給<ul>或者<ol>標記設置list-style-type屬性時，中間所有的<li>標記都會采用該設置。

? ? ? ? ??如果，對某一個<li>標記單獨設置list-style-type屬性，則僅僅作用于該條項目上。

<span style="font-size:24px;"><html><head><title>項目列表</title><style></style></head> <body><p>水上運動</p><ul><li>freestyle自由泳</li><li>backstroke仰泳</li><liclass="special">breaststroke 蛙泳</li><li>butterfly蝶泳</li><li>individualmedley 個人混合泳</li><li>freestylerelay 自由泳接力</li></ul></body> </html></span> ? ? ? ? ??可以看到蛙泳變成了空心圓顯示，其他的還是編號。

? ? ? ? ??此外，該屬性的屬性值還有很多，如下：

總結

以上是生活随笔為你收集整理的CSS设置列表的符号的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內容還不錯，歡迎將生活随笔推薦給好友。