CSS列表模型的计数器counter计数器是一种特殊的数字跟踪器，通常用于CSS列表项的自动编号。可以在项目中通过counter-increment、counter-set、counter-reset创建一个计数器，并在counter()/counters()中使用。在CSS语法中，需要定义一个counter-name作为计数器的唯一标识。解析计数器一般有以下步骤：当前计数器继承父元素，遵循父元素的计数规则，通过counter-reset实例化一个新的计数器，通过counter-increment设置计数器的增量值，设置counter通过counter-set通过counter()/counters()计数初始值使用countercounter-reset可以使用counter-reset在元素上实例化一个新的计数器，就是给新的计数器起一个名字，并附上一个初始值价值。[]中，为计数器的名称，为初始化，默认初始值为0。下面是两个常用的例子：h1{counter-reset:zhaodao}/*计数器名称'zhaodao'*/h1{counter-reset:zhaodao99}/*计数器名称'zhaodao'，初始值为99*/你也可以为初始值设置一个负数或者小数，但是当设置小数的时候，比如2.99，在IE和Firefox中是无法识别的，会被当成0；在Chrome下，它会被向下舍入并视为2。你也可以用它来同时命名多个计数器。H1{counter-reset:zhaodao-1zhaodaom99}counter-set的用法和counter-reset一样，这里不做解释，感兴趣的可以去https://www.w3.org/TR/2020/WD-css-lists-3-20200709标准文档自行阅读counter-increment可以使用counter-increment为你定义的计数器设置每次增量的值。计数规则可以简单描述为：counter-reset是唯一的，每执行一次counter-increment，计数值就加1。您可以像下面的示例一样使用它们。.counter{counter-reset:zhaodao2;逆增量：zhaodao；}.counter:before{content:counter(zhaodao);}这里值得一提的是，.counter作用的第一个元素的计数值显示为3，而不是定义的zhaodao初始值2。这是因为counter-increment。当第一个元素渲染出来的时候，counter-increment已经再次起作用了，这样初始值就加1，最终渲染出来的值是3，而不是2。可以用最简单的counter()/counters():counter(zhaodao)/*zhaodao是counter-reset的名称*/基本使用语法counter(name,style)，其中style与list-style相同-type代表一致性，表示计数的一种字符形式。例如，你可以这样使用它：counter(zhaodao,lower-roman);/*以小写罗马数字格式表示当前计数器zhaodao的值*/也可以使用counters()进行级联计数，使用语法counter(name,string)，其中string是一个字符串，必须是一个值，代表计数序号的连接字符串。可以实现类似1-1、1-2的效果，其中strting为-。zhaodao1zhaodao1-1
