HTML列表简介
在许多网页中都有列表的影子，比如洛谷的题目列表，
学习通的课程列表
在html中有三种列表：有序列表、无序列表和定义列表。
HTML有序列表ol
有序列表就是前面有按照某个顺序标明的数字，字母或者阿拉伯数字等的一列数据。
语法：
<ol>
<li>C++</li>
<li>JAVA</li>
<li>JavaScript</li>
<li>jQuery</li>
<li>Vue.js</li>
</ol>理解：ol，ordered list（有序列表），li，list（列表项）。
示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML有序列表</title>
</head>
<body>
<ol>
<li>C++</li>
<li>JAVA</li>
<li>HTML</li>
<li>Python</li>
<li>JavaScript</li>
<li>jQuery</li>
<li>Vue.js</li>
</ol>
</body>
</html>实现的效果：
高级语法：利用type属性
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML有序列表</title>
</head>
<body>
<ol type="I">
<li>C++</li>
<li>JAVA</li>
<li>HTML</li>
<li>Python</li>
<li>JavaScript</li>
<li>jQuery</li>
<li>Vue.js</li>
</ol>
</body>
</html>实现效果：
type属性有好几种：
| 属性值 | 含义 |
|---|---|
| a | 表示小写字母 |
| A | 表示大写字母 |
| i | 表示小写罗马数字 |
| I | 表示大写罗马数字 |
| 1 | 表示数字（默认） |
是不是感觉很简单，虽然是第一次学，但是很容易就上手，我了解到，等后面学到CSS，会有一种更好的方式来实现列表list。
HTML无序列表ul
这是最常用的一种列表形式，
语法：
<ul>
<li>C++</li>
<li>JAVA</li>
<li>JavaScript</li>
<li>jQuery</li>
<li>Vue.js</li>
</ul>理解：ul，unordered list（有序列表），li，list（列表项）。
示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML无序列表</title>
</head>
<body>
<ul>
<li>C++</li>
<li>JAVA</li>
<li>HTML</li>
<li>Python</li>
<li>JavaScript</li>
<li>jQuery</li>
<li>Vue.js</li>
</ul>
</body>
</html>实现的效果：
高级语法：利用type属性
这里和有序列表一样，都有type属性。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML无序列表</title>
</head>
<body>
<ul type="square">
<li>C++</li>
<li>JAVA</li>
<li>HTML</li>
<li>Python</li>
<li>JavaScript</li>
<li>jQuery</li>
<li>Vue.js</li>
</ul>
</body>
</html>实现效果：
square代表方框。
| 属性值 | 含义 |
|---|---|
| circle | 空心圆○ |
| disc | 实心圆●（默认值） |
| square | 正方形■ |
注意点
在<ol></ol>这一对标签里面，有两点要注意：
1、该标签子元素只能是li，不能加上其他标签。
错误示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML无序列表</title>
</head>
<body>
<ul type="square">
<p>所有学习到的技术</p>
<li>C++</li>
<li>JAVA</li>
<li>HTML</li>
<li>Python</li>
<li>JavaScript</li>
<li>jQuery</li>
<li>Vue.js</li>
</ul>
</body>
</html>实现的效果：
这个是错误的，要把<p></p>放在ul外面才是正确的。
2、该标签子元素只能是li，也不能直接写上其他的文字或字母。
错误示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML无序列表</title>
</head>
<body>
<ul type="square">
所有学习到的技术
<li>C++</li>
<li>JAVA</li>
<li>HTML</li>
<li>Python</li>
<li>JavaScript</li>
<li>jQuery</li>
<li>Vue.js</li>
</ul>
</body>
</html>实现的效果：
也是错误的。
HTML定义列表dl
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" /><!--charset 字符集，即编码形式-->>
<title>HTML定义列表</title>
</head>
<body>
<dl>
<dt>C++</dt>
<dd>C plus plus</dd>
</dl>
</body>
</html>实现效果：
只需要了解就可以了。
html5
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。