阅读计数html,css计数器怎么用字母

css计数器怎么用字母

css计数器使用字母可以使用 counter(chapter, lower-alpha);来实现。

1、首先重置ul的计数器为listStyle；

2、然后指定li标签的样式为counter-increment:listStyle；

3、最后用伪类元素::before添加counter，指定计数类型为lower-alpha即可。

第二个参数用于counter()定义所用计数器的类型，例如：

Document

ul {

counter-reset:listStyle;

list-style:none;

}

ul li {

margin-left:1em;

counter-increment:listStyle;

}

ul li::before {

margin-right:1em;

content:counter(listStyle,lower-alpha);

}

• one
• two
• three

效果：

计数器类型其他的取值：decimal，decimal-leading-zero，lower-roman，upper-roman，lower-greek，lower-latin，upper-latin，armenian，georgian，lower-alpha，upper-alpha。

本文来自css3答疑栏目，欢迎学习！