list-style和list-style-type的区别

list-style和list-style-type的区别

在清除列表项的样式时,可能会设置list-style:none,或者list-style-type:none,发现两者的效果是一样的,他们的区别是什么呢?

其实,list-style-type是list-style的其中一个属性,list-style有三个属性,他们分别是(按顺序):

list-style-type, list-style-position, list-style-image.

可只设置其中两个或一个,且三者都有继承性。

list-style的默认值为:disc outside none.

属性 描述
list-style-type 列表项标记的类型
list-style-position 设置列表项标记的位置
list-style-image 利用图像替换列表项的标记
list-style-type的值和描述
描述
none 无标记
circle 空心圆
square 实心方块
decimal 数字,1,2,3…
decimal-leading-zero 01, 02, 03…
lower-roman i, ii, iii, iv, v…
upper-roman I, II, III, IV, V…
lower-alpha/lower-latin a,b,c,d,e…
upper-alpha/upper-latin A,B,C,D,E…
cjk-ideographic 一、二、三…
list-style-position的值和描述
描述
inside 列表项标记在文本以内
outside 列表项标记在文本左侧
inherit 继承父元素的值
outside示例

list-style和list-style-type的区别_第1张图片

inside示例

list-style和list-style-type的区别_第2张图片

你可能感兴趣的:(CSS,列表)