1、无序列表--没有刻意顺序
(1)没有顺序级别之分,是并列的
(2)<ul>只能放<li>标签
(3)<li>里面可以放任何元素
(4)<ul>带有自己的样式属性
值 | 描述 |
disc | 默认值,实心圆 |
circle | 空心圆 |
square | 实心方块 |
2、有序列表--有刻意顺序
可用有序列表
(1)有顺序级别之分
(2)<ol>只能放<li>标签
(3)<li>里面可以放任何元素
type属性值 | 意义 |
a | 表示小写英文字母编号 |
A | 表示大写英文字母编号 |
i | 表示小写罗马数字编号 |
I | 表示大写罗马数字编号 |
1 | 表示数字编号(默认) |
ol的start属性必须是一个整数,指定了列表编号的起始值
ol的reversed属性指定列表中的条目是否倒序排列
受到type的干扰,没有type,最下面的那个排名越靠前
3、定义列表--解释说明含义的文字,且为列表形态
definition list定义列表
<dl>标签用于定义描述列表(或定义列表)
data term 数据项
<dt>(定义项目/名字)
data definition数据定义
<dd>(描述每一个项目/名字)--对dt进行解释说明
总结:
ul:搜索结果、导航栏目、新闻条目
ol:排行榜
dl:不容易察觉,页面文字构成定义关系
扩展:
列表属性li
1、定义列表符号样式
list-style-type:disc(实心圆)/circle(空心圆)/square(实心方块)/none(去掉列表符号);
list-style-type:none===list-style:none;
2、使用图片作为列表符号
list-style-image:url(所使用图片的路径及全称);
3、定义列表符号的位置
list-style-position:outside(外边)/inside(里边);
list-style:none;去掉列表符号