list-style-type属性

CSS列表属性允许我们设置不同的列表项标记。在HTML中,有两种类型的列表:

无序列表(<ul>) - 列表项标有项目列表

有序列表(<ol>) - 列表项标有数字或字母

使用CSS,列表可以进一步设置样式,图像可以用作列表项标记。

其中一种方法是使用list-style-type属性,可以设置为circle,square,decimal,disc,lower-alpha等

html

<ol class="lower-alpha">
	<li>
		红色 </li>
	<li>
		绿色 </li>
	<li>蓝色</li>
</ol>
<ul class="circle">
	<li>红色 </li>
	<li>绿色 </li>
	<li>蓝色 </li>
</ul>
<ul class="square">
	<li>红色 </li>
	<li>绿色 </li>
	<li>蓝色 </li>
</ul>

css

ol.lower-alpha {
   list-style-type: lower-alpha;
}
ul.circle {
   list-style-type: circle;
}
ul.square {
   list-style-type: square;
}

结果