学习如何使用HTML创建各种类型的列表
HTML提供了三种主要的列表类型：
无序列表使用<ul>标签创建，每个列表项使用<li>标签：
<ul>
<li>项目 1</li>
<li>项目 2</li>
<li>项目 3</li>
</ul>
使用CSS的list-style-type属性可以自定义项目符号：
ul {
list-style-type: circle; /* disc, circle, square, none */
}
有序列表使用<ol>标签创建，每个列表项使用<li>标签：
<ol>
<li>第一步</li>
<li>第二步</li>
<li>第三步</li>
</ol>
使用type属性可以指定编号类型：
<ol type="A"> <!-- A, a, I, i, 1 -->
<li>项目 A</li>
<li>项目 B</li>
<li>项目 C</li>
</ol>
描述列表使用<dl>标签创建，包含术语(<dt>)和描述(<dd>)：
<dl>
<dt>HTML</dt>
<dd>超文本标记语言，用于创建网页结构</dd>
<dt>CSS</dt>
<dd>层叠样式表，用于设计网页样式</dd>
<dt>JavaScript</dt>
<dd>脚本语言，用于实现网页交互</dd>
</dl>
列表可以嵌套使用，创建多级列表：
<ul>
<li>一级项目 1
<ul>
<li>二级项目 1.1</li>
<li>二级项目 1.2</li>
</ul>
</li>
<li>一级项目 2
<ul>
<li>二级项目 2.1</li>
<li>二级项目 2.2</li>
</ul>
</li>
</ul>
使用CSS可以创建自定义的列表样式：
.custom-list {
list-style: none;
padding: 0;
}
.custom-list li {
padding: 0.5rem;
margin: 0.5rem 0;
background: #f8f9fa;
border-radius: 3px;
position: relative;
padding-left: 2rem;
}
.custom-list li::before {
content: "•";
color: #e8491d;
position: absolute;
left: 1rem;
}