无序列表<ul>

无序列表的显示类型为“块级元素（block）”，其列表项子元素的显示类型为“list-item”（由于该类型的表现和“块级元素”几乎一致，所以可以将它的类型视为带有项目符号的“块级元素”）。

HTML代码示例：

运行效果：

无序列表可以通过“type”属性来设置“列表项目符号”的类型，不过还是建议在学习了CSS里的“list-style”属性后对其进行设置：

disc

项目符号以实心圆“●”表示，默认值。

circle

项目符号以空心圆“○”表示。

square

项目符号以实心方块“■”表示。

HTML代码示例：

运行效果：

无序列表还能够进行嵌套，以用于对列表项内的内容进行更为精细的结构划分和内容说明。

HTML代码示例：

运行效果：

有序列表<ol>

有序列表的显示类型和“无序列表”一样同样为“块级元素”，包括其列表项子元素的显示类型也和“无序列表”一致，唯一不同的就是列表项前不再是用“●”表示，而是“阿拉伯数字”+“.”的表现形式。

HTML代码示例：

运行效果：

有序列表具有以下属性：

reversed

规定有序列表的顺序为“倒叙”。

start

规定有序列表的起始值。

type

规定有序列表的序号显示类型，有以下值：

• “1”，默认，以阿拉伯数字作为列表符号
• “A”，以大写英文字母作为列表符号
• “a”，以小写英文字母作为列表符号
• “I”，以大写罗马数字作为列表符号
• “i”，以小写罗马数字作为列表符号

HTML代码示例：

运行效果（使用了“float”属性使列表横向排列）：

有序列表和无序列表一样可以进行嵌套，不过它的“type”属性需要手动设置后才能显示为不同的项目符号，否则全部都为以默认的“阿拉伯数字”显示：

HTML代码示例：

运行效果：

无序列表和有序列表的界限

在不设置任何CSS样式的情况下，无序列表不具有计数功能，而有序列表具有计数功能，但在通过CSS对该标签的“list-style”进行设置后，这两种类型的标签不再具有明显的功能界限，不仅能完全的消除列表项符号，还能将列表项前的符号设置为“图片”，设置列表项符号的悬挂方式等，这些在我们后面的CSS知识里会讲到。

定义列表<dl>

“定义列表”分为两层：第一层为定义的列表<dl>；第二层分为两个部分，即<dt>和<dd>，<dt>用于定义列表中的项目，<dd>用于描述定义的项目，它们的显示类型都为“块级元素（block）”。相对于“无序列表”和“有序列表”，这种列表由于其自身的结构原因，对需要进行名词性描述的列表更为适用（如本课件的各种属性的描述结构）。

HTML代码示例：

运行效果：