HTML基础知识（7）

列表标签

列表的应用场景

Ø 场景：在网页中按照行展示关联性的内容，如：新闻列表、排行榜、账单等
Ø 特点：按照行的方式，整齐显示内容
Ø 种类：无序列表、有序列表、自定义列表

1.1.1无序列表

Ø 场景：在网页中表示一组无顺序之分的列表，如：新闻列表。
Ø 标签组成

Ø 显示特点：
• 列表的每一项前默认显示圆点标识
Ø 注意点：
• ul标签中只允许包含li标签
• li标签可以包含任意内容

代码：

<ul>
<li>内容</li>
........
</ul>

 2.1.1有序列表

Ø 场景：在网页中表示一组有顺序之分的列表，如：排行榜。
Ø 标签组成

Ø 显示特点：
• 列表的每一项前默认显示序号标识
Ø 注意点：
• ol标签中只允许包含li标签
• li标签可以包含任意内容

代码：

<ol>
<li></li>
</ol>

 3.1.1自定义列表

Ø 场景：在网页的底部导航中通常会使用自定义列表实现。
Ø 标签组成：dt是列表标题 dd是列表的内容

Ø 显示特点：
• dd前会默认显示缩进效果
Ø 注意点：
• dl标签中只允许包含dt/dd标签
• dt/dd标签可以包含任意内容

代码

<dl>
<dt>列表标题</dt>
<dd>列表内容</dd>
</dl>