HTML
列表
在网页中一共有三种列表:有序列表,无序列表,定制列表
- 默认的项目符号我们一般都不使用!!
- 如果需要设置项目符号,则可以采用为li设置背景图片的方式来设置
1. 无序列表
- 使用ul标签来创建无序列表
- 使用li在ul中创建一个一个的列表项
- 通过type属性可以修改列表的项目符号
<p>菜谱</p>
<ul>
<li>宫保鸡丁
<ol>
<li>宫保</li>
<li>鸡丁</li>
</ol>
</li>
<li>鱼香肉丝
<ul>
<li>鱼香</li>
<li>肉丝</li>
</ul>
</li>
<li>剁椒鱼头</li>
</ul>
2. 有序列表
- 使用ol标签来创建无序列表
- 有序列表采用有序的序号作为项目符号
<p>菜谱</p>
<ul>
<li>宫保鸡丁
<ol>
<li>宫保</li>
<li>鸡丁</li>
</ol>
</li>
<li>鱼香肉丝
<ul>
<li>鱼香</li>
<li>肉丝</li>
</ul>
</li>
<li>剁椒鱼头</li>
</ul>
使用CSS可以去掉li前面默认自带的符号
<style type="text/css">
ul {
list-style: none;
}
ol {
list-style: none;
}
</style>
3. 定义列表
- 定义列表用来对一些词汇或内容进行定义
- 使用dl来创建一个定义列表
- ul,ol,dl之间可以互相嵌套
<dl>
<dt>武松</dt>
<dd>景阳冈打虎英雄,战斗力100</dd>
<dd>后打死西门庆,投奔梁山</dd>
<dt>武大郎</dt>
<dd>著名餐饮企业家,战斗力0</dd>
</dl>