©
本文档使用 PHP中文网手册 发布
counter-reset：none | [<identifier> <integer>]+
默认值：none
适用于：所有元素，::before, ::after, ::alternate, ::marker, ::line-marker, margin areas, @footnote areas, and @page context
继承性：无
动画性：否
计算值：指定值
none：阻止计数器复位
<identifier>：identifier定义一个或多个将被复位的selector，id，或者class
<integer>：定义被复位的数值，可以为负值，默认值是0
对应的脚本特性为counterReset。
| Values | IE | Firefox | Chrome | Safari | Opera | iOS Safari | Android Browser | Android Chrome |
|---|---|---|---|---|---|---|---|---|
| Basic Support | 6.0-7.0 | 2.0+ | 4.0+ | 6.0+ | 15.0+ | 6.0+ | 2.1+ | 18.0+ |
| 8.0+ |
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<meta charset="utf-8" />
<title>content-reset_CSS参考手册_web前端开发参考手册系列</title>
<meta name="author" content="Joy Du(飘零雾雨), dooyoe@gmail.com, www.doyoe.com" />
<style>
.test ol{margin:16px 0;padding:0;list-style:none;}
.test li li:before{color:#f00;font-family:georgia,serif,sans-serif;}
.counter1 li{counter-increment:testname;}
.counter1 li:before{content:counter(testname)".";counter-reset:testname;}
.counter2 li{counter-increment:testname2;}
.counter2 li:before{content:counter(testname2)".";counter-reset:testname2 20;}
.counter3 li{counter-increment:testname3;}
.counter3 li:before{content:counter(testname3)".";counter-reset:testname3 -1;}
</style>
</head>
<body>
<ul class="test">
<li class="counter1">
<strong>默认时被复位的计数器：</strong>
<ol>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ol>
</li>
<li class="counter2">
<strong>将计算器复位为20：</strong>
<ol>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ol>
</li>
<li class="counter3">
<strong>将计算器复位为-1：</strong>
<ol>
<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ol>
</li>
</ul>
</body>
</html>
点击 "运行实例" 按钮查看在线实例