一、无序列表<ul>

图1-1 无序列表

图1-2 无序列表效果

1. 在无序列表中，<ul>和<li>是配合使用的，<ul>是<li>的父元素，<li>是<ul>的子元素。

2. <ul>的子元素必须是<li>，其它内容为非法嵌套。而<li>内可以放任何标签，图片，链接等什么都可以的。<li>的父元素必须是<ul>或<ol>。

3.修改小圆圈图案，在css里设置list-style，如果不想显示图案，设置list-style: none即可。

图1-3 修改无序列表图案

图1-4 修改为方形后的效果

二、有序列表<ol>

图2-1 有序列表

图2-2 有序列表效果

1. 和无序列表很像，在有序列表中，<ol>和<li>是配合使用的，<ol>是<li>的父元素，<li>是<ol>的子元素。

2. <ol>的子元素必须是<li>，其它内容为非法嵌套。而<li>内可以放任何标签，图片，链接等什么都可以的。<li>的父元素必须是<ul>或<ol>。

3.修改小图标图案的方式和无序列表相同。

三、自定义列表<dl>

图3-1 自定义列表

图3-2 效果

1. 自定义列表由<dl>和<dt><dd>配合使用的，<dl>是<dt>和<dd>的父元素，<dt>和<dd>是<dl>的子元素。<dt>和<dd>则是兄弟元素关系，不需要缩进。

2. <dt>是小标题，<dd>是对<dt>的解释和说明。