一、列表标签的分类
1、无序列表
2、有序列表
3、自定义列表
二、列表标签的特点
使得界面更加的干净、整洁、有序。
三、列表标签的应用
1、无序列表(ul)
无序列表的各个列表项之间是没有顺序级别之分的，是并列的。
基本语法格式如下：
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
...
</ul>
注：ul标签中只能存放li标签，而li 标签相当于一个容器，可以放任何标签。
2、有序列表（ol）
有序列表中的各个列表项之间是有顺序之分的，比如说比赛名次等必须按照1 2 3的顺序排列，在输出时，有序列表会自动给列表项之前加上顺序，1、2、3…
有序列表的基本语法格式如下：
<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
...
</ol>
3、自定义列表
基本语法格式入下;
- 兰州市
- 城关区
- 安宁区
- 七里河区
- 西固区
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 1、无序列表 -->
<ul>
<li>彭昱畅</li>
<li>刘昊然</li>
<li>张子枫</li>
</ul>
<!-- 2、有序列表 -->
<ol>
<li>第一名</li>
<li>第二名</li>
<li>第三名</li>
</ol>
<!--3、自定义列表 -->
<dl>
<dt>兰州市</dt>
<dd>城关区</dd>
<dd>安宁区</dd>
<dd>七里河区</dd>
<dd>西固区</dd>
</dl>
</body>
</html>
输出的结果如下所示：
补充无序列表;
由于Ul标签中只能存放li标签，所以想要为以上无序列表中的三人添加更多信息，则可以选择在li标签中选择使用其他标签。
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
1、无序列表<br />
<ul>
<li>彭昱畅
<p>
彭昱畅，1994年10月25日出生于江西省新余市，毕业于上海戏剧学院木偶表演系，中国内地男演员</p>
<p>
2015年12月，参演爱情喜剧《太子妃升职记》，以强公公一角正式出道,2016年1月，以湖南卫视《天天向上》“天天小兄弟”主持登场 ；同年主演明星养成网络剧《明星志愿》 和搜狐自制剧《刺客列传》 ；2017年，出演青春励志剧《浪花一朵朵》 ；同年，凭借校园励志片《闪光少女》提名第20届上海电影节亚洲新人奖最佳男演员奖；同年，参加浙江卫视《演员的诞生》 ；2018年4月13日，作为固定成员参加湖南卫视的综艺节目《向往的生活》第二季 。2019年，参演都市情感剧《都挺好》 [10] ；8月，获2019福布斯中国100名人榜荣誉 。
</p>
</li>
<li>刘昊然
<p>
刘昊然，1997年10月10日出生于河南省平顶山市，中国内地男演员，就读于中央戏剧学院表演系本科。2014年，主演电影《北京爱情故事》，正式出道，凭借该片提名第21届北京大学生电影节最佳新人奖。2015年5月，加盟国防教育特别节目《真正男子汉》；7月，以专业和文化双科第一名的成绩被中央戏剧学院录取.
</p>
</li>
<li>张子枫
<p>
张子枫，2001年8月27日出生于河南省三门峡市，中国内地女演员。在5岁时，张子枫开始拍广告并因参演多部电视剧从而进入演艺圈。2009年，凭灾难情感片《唐山大地震》的“小方登”一角而崭露头角，并获得第31届大众电影百花奖最佳新人奖。
</p>
</li>
</ul>
</body>
</html>
结果如下图：
