counter-reset：此值是必需的。必须用于选择器，主要用来标识该作用域，其值可以自定义。
counter-increment：用来标识计数器与实际相关联的范围。
content：用来生成内容，其为:before、:after或::before、::after的一个属性。在生成计数器内容，主要配合counter()一起使用。
counter()：该函数用来设置插入计数器的值。
:before、:after或::before、::after：配合content用来生成计数器内容。
mdn的例子：
<!doctype html><html lang="zh-cmn-hans"><head><meta charset="utf-8" /><title>counters()函数_css参考手册_web前端开发参考手册系列</title><meta name="author" content="joy du(飘零雾雨), dooyoe@gmail.com, www.doyoe.com" /><style>ol { margin: 0; padding: 0 0 0 2em; list-style: none; counter-reset: item; }li:before { counter-increment: item; content: counters(item, "."); color: #f00; }</style></head><body><ol class="test"> <li>node <ol> <li>node <ol> <li>node</li> <li>node</li> <li>node</li> </ol> </li> <li>node</li> </ol> </li> <li>node</li> <li>node</li></ol></body></html>
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
相关阅读：
在js中encodeuri(url)怎样才能不出现乱码？
前后端数据应该如何科学交互
css中的margin负值如何使用
chrome的内存不足频繁崩溃怎么处理
以上就是css的counters属性详解的详细内容。