HTML 有序、无序和定义列表

无序列表

<ul>
  <li>咖啡</li>
  <li>茶</li>
  <li>牛奶</li>
</ul>

• 咖啡
• 茶
• 牛奶

• 不同无序列表

<h4>Disc 项目符号列表：</h4>
<ul type="disc">
 <li>苹果</li>
 <li>香蕉</li>
 <li>柠檬</li>
 <li>桔子</li>
</ul>  

<h4>Circle 项目符号列表：</h4>
<ul type="circle">
 <li>苹果</li>
 <li>香蕉</li>
 <li>柠檬</li>
 <li>桔子</li>
</ul>  

<h4>Square 项目符号列表：</h4>
<ul type="square">
 <li>苹果</li>
 <li>香蕉</li>
 <li>柠檬</li>
 <li>桔子</li>
</ul>  

Disc 项目符号列表：

• 苹果
• 香蕉
• 柠檬
• 桔子

Circle 项目符号列表：

• 苹果
• 香蕉
• 柠檬
• 桔子

Square 项目符号列表：

• 苹果
• 香蕉
• 柠檬
• 桔子

有序列表

<ol>
  <li>咖啡</li>
  <li>牛奶</li>
  <li>茶</li>
</ol>

1. 咖啡
2. 牛奶
3. 茶

不同有序列表

<h4>数字列表：</h4>
<ol>
 <li>苹果</li>
 <li>香蕉</li>
 <li>柠檬</li>
 <li>桔子</li>
</ol>  

<h4>字母列表：</h4>
<ol type="A">
 <li>苹果</li>
 <li>香蕉</li>
 <li>柠檬</li>
 <li>桔子</li>
</ol>  

<h4>小写字母列表：</h4>
<ol type="a">
 <li>苹果</li>
 <li>香蕉</li>
 <li>柠檬</li>
 <li>桔子</li>
</ol>  

<h4>罗马字母列表：</h4>
<ol type="I">
 <li>苹果</li>
 <li>香蕉</li>
 <li>柠檬</li>
 <li>桔子</li>
</ol>  

<h4>小写罗马字母列表：</h4>
<ol type="i">
 <li>苹果</li>
 <li>香蕉</li>
 <li>柠檬</li>
 <li>桔子</li>
</ol>  

数字列表：

1. 苹果
2. 香蕉
3. 柠檬
4. 桔子

字母列表：

1. 苹果
2. 香蕉
3. 柠檬
4. 桔子

小写字母列表：

1. 苹果
2. 香蕉
3. 柠檬
4. 桔子

罗马字母列表：

1. 苹果
2. 香蕉
3. 柠檬
4. 桔子

小写罗马字母列表：

1. 苹果
2. 香蕉
3. 柠檬
4. 桔子

一个定义列表

<dl>
   <dt>计算机</dt>
   <dd>用来计算的仪器 ... ...</dd>
   <dt>显示器</dt>
   <dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>

计算机

用来计算的仪器 ... ...

显示器

以视觉方式显示信息的装置 ... ...

原文地址：https://www.cnblogs.com/Xuman0927/p/12068131.html