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

  • 无序列表:给一堆数据添加列表语义, 并且这一堆数据中所有的数据都没有先后之分。

格式:<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
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值