列表

HTML中的列表：

　　　　　　　　  有序列表  --  ol

　　　　　　　   无序列表  --  ul

　　　　　　       定义列表  --  dl

有序列表、无序列表都是通过<li>标签来定义列表的项，定义列表则不同，用<dt>来定义列表的项目<dd>来定义项目的描述。

有序列表 示例：

 

    <ol>
        <li>苹果</li>
        <li>橙子</li>
        <li>香蕉</li>
    </ol>

 

 

 

显示效果：

 

有序列表默认的是阿拉伯数字排序，还可以更改列表样式，把前面的顺序1、2、3换成a(A)、b(B)、c(C)或者Ⅰ(i)、Ⅱ(ii)、Ⅲ(iii).

例如：

    <ol type="I">
        <li>苹果</li>
        <li>橙子</li>
        <li>香蕉</li>
    </ol>

显示效果：

同时，还可以设置起始位置的值（数字序号情况下）：

   <ol start="3">
        <li>苹果</li>
        <li>橙子</li>
        <li>香蕉</li>
    </ol>

显示效果：

 

无序列表 示例:

  <ul>
        <li>苹果</li>
        <li>橙子</li>
        <li>香蕉</li>
    </ul>

显示效果：

前面的实心圆点是默认类型disc，换成其他类型，如square；

则

    <ul type="square">
        <li>苹果</li>
        <li>橙子</li>
        <li>香蕉</li>
    </ul>

显示效果：

如果不需要内容前面的点，可以通过对li设置style="list-style-type: none" 样式来解决。

定义列表 示例：

 

  <dl>
       <dt>爱好</dt>
        <dd>游泳</dd>
        <dd>音乐</dd>
        <dd>读书</dd>
    </dl>

 

显示效果：