HTML列表

 

HTML无序列表

无序列表是一个项目的列表，此列项目是使用粗体圆点（典型的小黑圆圈）进行标记，无序列表使用<ul>标签

实例：

<ul>
<li>1</li>
<li>2</li>
<ul>

HTML有序列表

有序列表也是一列项目，列表使用数字项目进行标记。有序列表始于<ol>标签，每个列表始于<li>标签

实例：

<ol>
<li>1</li>
<li>2</li>
<ol>

HTML自定义列表

自定义列表不仅仅是一列项目，而是项目及注释的组合。自定义列表始于<dl>标签，每个自定义列表项以<dt>开始，每个自定义列表项定义以<dd>开始

实例：

<dl>
<dt>第一名</dt>
<dd>123</dd>
<dt>第二名</dt>
<dd>456</dd>
</dl>

注意：列表项内部可以使用段落、换行符、图片、链接等

不同类型的列表演示

不同类型的有序列表

实例：

<h4>编号列表 </h4> 
<ol>
<li>1</li>
<li>2</li>
</ol>
<br />
<h4>大小字母列表</h4>
<ol type="A">
<li>1</li>
<li>2</li>
</ol>
<br />
<h4>小写字母列表</h4>
<ol type="a">
<li>1</li>
<li>2</li>
</ol>
<br />
<h4>罗马数字列表</h4>
<ol type="I">
<li>1</li>
<li>2</li>
</ol>
<br />
<h4>小写罗马数字列表</h4>
<ol type="i">
<li>1</li>
<li>2</li>
</ol>

不同类型的无序列表

实例：

<h4>圆点列表</h4>  
<ul>
<li>1</li>
<li>2</li>
</ul>
<br />
<h4>圆圈列表</h4>
<ul style="list-style-type:circle;">
<li>1</li>
<li>2</li>
</ul>
<br />
<h4>正方形列表</h4>
<ul style="list-style-type:square;">
<li>1</li>
<li>2</li>
</ul>

嵌套列表

实例：

<h4>嵌套列表</h4>
<ul>
<li>一班</li>
<li>第一名
<ul>
<li>1</li>
<li>2</li>
</ul>
</li>
<li>第二名</li>
</ul>

嵌套列表2

实例：

<h4>嵌套列表2</h4>  
<ul>
<li>一班</li>
<li>第一名
<ul>
<li>1</li>
<li>2
<ul>
<li>数学</li>
<li>语文</li>
</ul>
</ul>
</li>
<li>第二名</li>
</ul>