列表标签:无序列表、有序列表、定义列表

来源:互联网 发布:淘宝卖家哪个商品好用 编辑:程序博客网 时间:2024/05/22 13:28
  • 无序列表:给一堆数据添加列表语义, 并且这一堆数据中所有的数据都没有先后之分。

格式:<ul>
<li>需要显示的条目内容</li>
</ul>
li其实是英文list item的缩写

注意:1.一定要记住ul标签是用来给一堆数据添加列表语义的, 而不是用来给他们添加小圆点的。
2. ul标签和li标签是一个整体, 是一个组合. 所以一般情况下ul标签和li标签都是一起出现。
3. 由于ul标签和li标签是一个组合, 所以ul标签中不推荐包含其它标签。


  • 有序列表: 给一堆数据添加列表语义, 并且这一堆数据中所有的数据都有先后之分
    格式:
    <ol>
    <li></li>
    </ol>

使用方式和无序列表差不多,但场景不同


  • 定义列表:一堆数据添加列表语义,先通过dt标签定义列表中的所有标题, 然后再通过dd标签给每个标题添加描述信息。
    格式:`
四川
天府之国
成都
蓉城
<dl>    <dt></dt>    <dd></dd>    <dd></dd>    <dt></dt>    <dd></dd></dl>

其实dt和dd都是英文的缩写
dt是英文definition title的缩写, 所以dt的含义就是用来定义列表中的标题
dd是英文definition description的缩写, 所以dd的含义就是用来定义标题对应的描述的`

定义列表的应用场景:做网站尾部的相关信息;做图文混排。

注意:
1.和ul/ol一样, dl和dt/dd是一个整体, 所以他们一般情况下不会单独出现, 都是一起出现。
2.和ul/ol一样, 由于dl和dt/dd是一个组合标签, 所以dl中建议只放dt和dd标签
3.个dt可以没有对应的dd,也可以有多个对应的dd, 但是无论有或者没有dd都不推荐使用.
推荐使用一个dt对应一个dd
4.和li标签一样, 当需要丰富界面时, 我们可以在dt和dd标签中继续添加其它标签

0 0
原创粉丝点击