1. counter-reset 计数器-重置
语法：
div {
counter-reset: name 0;
// counter-reset: 计数器名称 初始值
}
初始值：默认0，可为负值，如果是小数，Chrome会向下取整，如2.99 -> 2，其他浏览器可能会重置为0
counter-reset 可以多个计数器同时命名，比如 counter-reset: name1 0 name2 0 name3 0.
2. counter-increment 计数器
counter-increment 出现一次，计数器的值就增加相应的值，counter-increment 可以设置：
counter-increment: name 3;
表示 name 计数器的值一次增加3. 还可以设置为负值，表示递减。
3. counter() 显示计数
counter() 方法的作用是显示计数，counter(name) ， 还可以 counter(name, style)，style 支持的关键字值就是 list-style-type:
list-style-type: disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | none | armenian | cjk-ideographic | georgian | lower-greek | hebrew | hiragana | hiragana-iroha | lower-latin | upper-latin
4.counters() 显示嵌套计数
counters(name, string)
// string 必须，表示子序号的连接字符串
举个例子表示嵌套计数
ol {
counter-reset: section;
list-style-type: none;
}
li::before {
counter-increment: section;
content: counters(section, '.') ' ';
}
<ol>
<li>第一章</li>
<li>第二章
<ol>
<li>第二章第一节课</li>
<li>第二章第一节课</li>
</ol>
</li>
<li>第三章
<ol>
<li>第三章第一节课
<ol>
<li>第三章第一节课补充</li>
</ol>
</li>
<li>第三章第一节课 </li>
</ol>
</li>
<li>第四章</li>
<li>第五章</li>
</ol>
结果
