CSS列表控制

概述
列表控制属性
可选值 释义
list-style-type 指定列表项标签的类型
list-style-image 列表标签为图像时该图像的url
list-style-position 指定列表项标签的位置
list-style 简写属性时，属性值的顺序为list-style-type list-style-position list-style-image如果缺少上述属性值之一，则将插入缺失属性的默认值
1.列表标签类型list-style-type
将表格边框和单元格边框折叠为单一边框，即合并边框。
可选值 释义
lower-latin 小写拉丁字母
lower-roman 小写罗马字母
none 没有列表符号
square 方黑点
unset 圆黑点
upper-alpha 大写阿尔法字母
upper-latin 大写拉丁字母
upper-roman 大写罗马数字
armenian 亚美尼亚语
circle 小圆圈
decimal 数字加小数点
decimal-leading-zero 带0数字
disc 黑点
georgian 乔治亚语
lower-alpha 小写英文字母
lower-greek 希腊字母
    社团列表
  • 天文社
  • 音乐社
  • 溜冰社
  • 舞蹈社
	
#list_test1{
	list-style-type: lower-alpha;
}
2.列表图像标签list-style-image
列表标签为图像时该图像的url。
    社团列表
  • 天文社
  • 音乐社
  • 溜冰社
  • 舞蹈社
	
#list_test2{
	list-style-image: url(../images/Python_20x20.png);
}
3.列表标签位置list-style-position
outside（默认值）列表项标记放置在文本以外的左侧，且环绕文本不根据标记对齐。 inside列表项标记放置在文本以内，且环绕文本根据标记对齐。 inherit从父元素继承list-style-position属性的值。
    社团列表
  • 天文社
  • 音乐社
  • 溜冰社
  • 舞蹈社

    社团列表
  • 天文社
  • 音乐社
  • 溜冰社
  • 舞蹈社
	
#list_test3{
	list-style-position: inside;
}
#list_test4{
	list-style-position: outside;
}
4.有序列表起始编号start
默认情况下，有序列表（ol）会从1开始计数并依次递增。 如果想要自定义列表项的起始编号，可以通过修改start属性来实现。该属性接受一个正整数值作为参数，指定了列表项的起始编号。
    社团列表
  1. 天文社
  2. 音乐社
  3. 溜冰社
  4. 舞蹈社

    社团列表
  1. 天文社
  2. 音乐社
  3. 溜冰社
  4. 舞蹈社
	
<ol id="list_test5" start="1">社团列表
	<li class="list_li">天文社</li>
	<li class="list_li">音乐社</li>
	<li class="list_li">溜冰社</li>
	<li class="list_li">舞蹈社</li>
</ol>	
<br />
<ol id="list_test6" start="4">社团列表
	<li class="list_li">天文社</li>
	<li class="list_li">音乐社</li>
	<li class="list_li">溜冰社</li>
	<li class="list_li">舞蹈社</li>
</ol>