HTML 支持有序、无序和定义列表:
- 无序列表
- 有序列表
- 自定义列表
1.无序列表
1.定义：无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。
2.形式：
无序列表 Unordered List <ul> </ul> 代表整体 ul标签中只允许嵌套li标签
列表项 List Item <li> </li> 代表每一项 li标签可存放任何内容
-
<ul></ul>中只能嵌套<li></li>，直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。
-
<li>与</li>之间相当于一个容器，可以容纳所有元素。
3.代码展示：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>4.运行结果展示：
2.有序列表
1.定义：
有序列表也是一列项目，列表项目使用数字进行标记。
有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。
- 第一个列表项
- 第二个列表项
- 第三个列表项
-
<ol>标签中的type属性值为排序的序列号，不添加type属性时，有序列表默认从数字1开始排序。
-
常用的type属性值分别为是1，a，A，i，I
-
<ol reversed="reversed">中的reversed属性能够让有序列表中的序列倒序排列。
-
<ol start="3">中的start属性值为3，有序列表中的第一个序列号将从3开始排列。
2.形式 ：
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
3.代码展示：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
</body>
</html>4.运行结果展示：
3.自定义列表
1.定义：自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
dl标签：整体 dt标签：主题 dd标签:对于主题的每一项内容
2.形式：
<dl>
<dt>名词1</dt>
<dd>名词1解释1</dd>
<dd>名词1解释2</dd>
...
<dt>名词2</dt>
<dd>名词2解释1</dd>
<dd>名词2解释2</dd>
...
</dl>
3.代码展示：
<dl>
<dt>帮助中心</dt>
<dt>账户管理</dt>
<dt>购物指南</dt>
</dl>
扫一扫
366
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
