html5有序列表实心点,图文详解HTML中有序列表、无序列表和自定义列表的区别

在页面布局时,经常会用到列表,列表分为有序列表、无序列表和自定义列表,那你知道有序列表、无序列表和自定义列表之间的区别吗?这篇文章就给大家介绍有序列表、无序列表和自定义列表分别用什么标签,以及三者之间的区别,有一定的参考价值,感兴趣的朋友可以看看。

一、无序列表

  • 标签用来定义无序列表,将
    • 标签与
    • 标签一起使用,就可以创建无序列表。

      举例:用无序列表列举四大名著,代码如下:

      • 红楼梦
      • 水浒传
      • 三国演义
      • 西游记

      效果图:

      dfb231c55925491161448a49693df091.png

      无序列表属性type,默认的样式是小黑圆,就是disc,type属性有disc(实心圆默认)、circle(空心圆)、square(实心正方形)、none(取消前缀)。

      二、有序列表

      1. 标签可以定义有序列表,将
        1. 标签与
        2. 标签一起使用,就可以创建有序列表,列表排序以数字来显示。

          示范代码如下:

          1. 红楼梦
          2. 水浒传
          3. 三国演义
          4. 西游记

          效果图:

          cc72b08bce23c637e1fc8eedb1f9f01a.png

          有序列表有两个属性,分别是type和start。 type有五个属性值:1、a、A、i、I(罗马数字),用来表示列表前缀的样式。start表示从type类型的第几个数字开始,比如当type=“a”,start=“4”,指选择的是小写字母类型,从第四个字母d开始列举。

          三、自定义列表

          一起使用,创建自定义列表(描述列表)。

          示范代码如下:

          中国四大名著
          红楼梦
          西游记
          水浒传
          三国演义

          效果图:

          8f4dddb7e47d4b817d7948f5de5c9746.png

          自定义列表(描述列表)中,在dt和dd中有了一个缩进。

          有序列表、无序列表和自定义列表的区别:

          有序列表和无序列表都有前缀,但是有序列表是大写字母、小写字母、数字和罗马数字等,而无序列表的前缀是实心圆、空心圆、实心正方形。自定义列表与有序列表,无序列表的区别是它有缩进而没有前缀。

          【相关教程推荐】

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值