HTML-列表标签
列表标签有三个展现形式:无序列表、有序列表、自定义列表
一、无序列表
1、含义:没有顺序的列表清单
2、基本语法:
<ul>
<li>文本</li>
<li>文本</li>
<li>文本</li>
</ul>
3、相关属性:type="",type的属性值有:disc、circle、square、none
type="列表项的显示内容"
例如:
<!-- 列表前面是黑色实心方块 -->
<ul type="square">
<li>文本</li>
<li>文本</li>
<li>文本</li>
</ul>
(1)disc:黑色实心圆
(2)circle:空心圆
(3)square:黑色实心方块
(4)none:取消列表项
注意:实际开发的时候,以上的属性几乎不会使用,使用频率最多的是none,目的是取消列表项,其他对应的列表项,需要使用背景图片完成,方便调整位置。
可用快捷键:ul>li{文本}*3
二、有序列表
1、含义:有顺序的列表清单
2、基本语法:
<ol>
<li>文本</li>
<li>文本</li>
<li>文本</li>
</ol>
3、相关属性:
(1)type属性:用来修饰列表项
type="1/A/a/I/i"
1:根据数字计数
A/a:根据(大写/小写)字母计数
I/i:根据罗马(大写/小写)数字来计数
(2)start属性:用来修改列表项的起始位置
start="数值"
数值表示从第“数值”个位置开始计数
例如:
<!-- 计数方式为“a、b、c、d...” 从第五个位置开始,即从e开始 -->
<ol type="a" start="5">
<li>第一步骤</li>
<li>第二步骤</li>
<li>第二步骤</li>
</ol>
可用快捷键:ol>li{文本}*3
三、自定义列表
1、含义:主要应用于图文混排或者问答列表
2、基本语法:
<dl>
<dt>图片/问题</dt>
<dd>文本/答案</dd>
</dl>
例如:
<dl>
<dt>问题:哪里发货</dt>
<dd>回答:北京发货</dd>
</dl>