引入
HTML 列表用于把一组相关内容整理在一起，例如菜单、步骤、清单、说明项等。
列表可以让内容结构更清楚，也方便浏览器、搜索引擎和用户理解页面信息。
正文
定义
定义
HTML 列表是一组按顺序或不按顺序排列的内容项，每个内容项通常使用
<li>标签表示。
HTML 中常见的列表有三种：
- 无序列表：
<ul> - 有序列表：
<ol> - 描述列表：
<dl>
无序列表
无序列表使用 <ul> 标签，列表中的每一项使用 <li> 标签。
它适合表示没有先后顺序的一组内容。
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>浏览器默认会在每一项前面显示圆点。
常见场景
无序列表常用于导航菜单、功能清单、文章要点等。
<ul>
<li>首页</li>
<li>文章</li>
<li>关于我</li>
</ul>有序列表
有序列表使用 <ol> 标签，列表中的每一项同样使用 <li> 标签。
它适合表示有先后顺序的一组内容。
<ol>
<li>打开浏览器</li>
<li>输入网址</li>
<li>访问网页</li>
</ol>浏览器默认会在每一项前面显示数字。
常见场景
有序列表常用于操作步骤、排名、学习顺序等。
<ol>
<li>学习 HTML 基础语法</li>
<li>学习 CSS 样式</li>
<li>学习 JavaScript 交互</li>
</ol>列表项
<li> 表示列表中的一个项目。
<li> 必须放在 <ul>、<ol> 或菜单类列表中使用，不建议单独写。
<ul>
<li>这是一个列表项</li>
</ul>描述列表
描述列表使用 <dl> 标签。
其中：
<dt>表示要解释的名称<dd>表示这个名称的说明
<dl>
<dt>HTML</dt>
<dd>用于描述网页结构。</dd>
<dt>CSS</dt>
<dd>用于控制网页样式。</dd>
</dl>描述列表适合用来写术语解释、问答、属性说明等内容。
嵌套列表
列表里面也可以继续放列表，这叫嵌套列表。
<ul>
<li>前端
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</li>
<li>后端</li>
</ul>嵌套列表要注意结构清晰，里面的列表通常放在某个 <li> 内部。
常见属性
type
type 可以改变列表标记的类型。
<ol type="A">
<li>第一项</li>
<li>第二项</li>
</ol>ol 中常见的 type 值：
1表示数字A表示大写字母a表示小写字母I表示大写罗马数字i表示小写罗马数字
start
start 用于设置有序列表从第几个编号开始。
<ol start="3">
<li>第三步</li>
<li>第四步</li>
</ol>reversed
reversed 用于让有序列表倒序显示。
<ol reversed>
<li>第三名</li>
<li>第二名</li>
<li>第一名</li>
</ol>reversed 是布尔属性，写上它就表示开启倒序。
特点
<ul>表示无序列表，适合没有先后关系的内容<ol>表示有序列表，适合有步骤、排名、顺序的内容<li>表示列表项，通常放在<ul>或<ol>里面<dl>、<dt>、<dd>用于描述列表，适合术语解释- 列表可以嵌套，但结构要写清楚
- 列表默认样式可以通过 CSS 修改
注意事项
- 不要只为了缩进就使用列表，列表应该表示一组相关内容
<li>不建议脱离<ul>或<ol>单独使用- 嵌套列表时，里面的
<ul>或<ol>应该放在某个<li>内部 - 如果只是想改变圆点、数字、间距，应该交给 CSS 处理
- 导航菜单也常用列表结构，但样式通常由 CSS 控制
理解
可以把 HTML 列表理解为“把同一类内容整理成一组”。
如果内容没有顺序，就用 <ul>；如果内容有先后顺序，就用 <ol>；如果是名词加解释，就用 <dl>。
列表的重点不是圆点或数字，而是表达内容之间的组织关系。
引出
理解列表之后，可以继续学习 HTML 表格，它也用于组织内容，但更适合展示行和列的数据。