列表标签
- 作用:告诉浏览器这一堆数据是一个整体
- 分类:无序列表、有序列表、定义列表
无序列表
- 作用:给一堆数据添加列表语义,且所有数据没有先后之分
- 格式:
<ul>
<li>需要显示的条目内容</li>
</ul>
- 注意点:
- ul和li标签是一个组合,一般情况下一起出现
- ul标签中不推荐包含除li外的其他标签,li标签中的内容可能会很复杂,因此,可以在li标签中添加其它标签来丰富界面(可添加ul标签,实现列表嵌套),比如:
<h2>物品清单</h2>
<ul>
<li>
<h3>蔬菜</h3>
<ul>
<li>白菜</li>
<li>萝卜</li>
<li>黄瓜</li>
</ul>
</li>
<li>
<h3>水果</h3>
<ul>
<li>苹果</li>
<li>梨子</li>
<li>桃子</li>
</ul>
</li>
</ul>
ul>li*2>h2+ul>li*3
有序列表
- 作用:给一堆数据添加语义,且所有数据有先后之分
- 格式:
<ol>
<li></li>
</ol>
定义列表
- 作用:定义列表的作用
- 给一堆数据添加列表语义
- dt定义列表中所有标题,dd给每个标题添加描述信息
- 格式:
<dl>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
<dl>
- dt:definition title,定义列表中的标题
- dd:definition description,定义标题中对应的描述
- 定义列表应用
- 注意点:
- dl和dt、dd是整体,一般一起出现
- dl中只加dt和dd
- dt可以没有对应的dd,推荐一个dt对一个dd
- 需要丰富界面时,可以在dt和dd标签中继续添加其余标签