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

一、无序列表

  • 标签与
  • 举例:用无序列表列举四大名著,代码如下:
  • 红楼梦
  • 水浒传
  • 三国演义
  • 西游记

效果图:

html5中有序列表怎么设置边框 html5有序列表和无序列表_自定义

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

二、有序列表

  1. 标签与
  2. 示范代码如下:
  1. 红楼梦
  2. 水浒传
  3. 三国演义
  4. 西游记

效果图:

html5中有序列表怎么设置边框 html5有序列表和无序列表_缩进_02

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

三、自定义列表

示范代码如下:

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

效果图:

html5中有序列表怎么设置边框 html5有序列表和无序列表_html5中有序列表怎么设置边框_03

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

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

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