[TOC] >[info]在页面设计中,一系列类似的结构或者数据,可以通过列表的形式来处理。 ## 无序列表 无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。 无序列表始于`<ul>` 标签。每个列表项始于`<li>` 。 ~~~ <ul> <li>学并思手册</li> <li>学并思官网</li> </ul> ~~~ **效果如下** <ul> <li>学并思手册</li> <li>学并思官网</li> </ul> ## 有序列表 同样,有序列表也是一列项目,列表项目使用数字进行标记。 有序列表始于 `<ol>` 标签。每个列表项始于 `<li>` 标签。 ~~~ <ol> <li>学并思手册</li> <li>学并思官网</li> </ol> ~~~ **效果如下** <ol> <li>学并思手册</li> <li>学并思官网</li> </ol> ## 定义列表 自定义列表不仅仅是一列项目,而是项目及其注释的组合。 自定义列表以 `<dl>` 标签开始。每个自定义列表项以 `<dt>` 开始。每个自定义列表项的定义以 `<dd>` 开始。 ~~~ <dl> <dt>学并思</dt> <dd>一个专业的PHP学习平台</dd> <dt>大牛学院</dt> <dd>一个在线教育平台</dd> </dl> ~~~ **效果如下** <dl> <dt>学并思</dt> <dd>一个专业的PHP学习平台</dd> <dt>大牛学院</dt> <dd>一个在线教育平台</dd> </dl> >[warning]以上效果都是没有做修饰,为默认效果。实际开发中会以css进行修饰。 * * * * * >[danger]**作业:**把三种列表都练习几遍,理清结构和写法。