此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。
counter-reset
Baseline Widely available *
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
* Some parts of this feature may have varying levels of support.
counter-resetCSS 属性用于创建具名CSS 计数器，并将其初始化为指定值。它支持创建从 1 向上计数到元素数量的计数器，以及从元素数量向下计数到 1 的计数器。
尝试一下
counter-reset: none;counter-reset: chapter-count 0;counter-reset: chapter-count;counter-reset: chapter-count 5;counter-reset: chapter-count -5;<section> <div> <h1>Alice's Adventures in Wonderland</h1> <h2>Down the Rabbit-Hole</h2> <h2>The Pool of Tears</h2> <h2>A Caucus-Race and a Long Tale</h2> <h2>The Rabbit Sends in a Little Bill</h2> </div></section>#default-example { text-align: left; counter-reset: chapter-count;}#example-element { background-color: lightblue; color: black;}h2 { counter-increment: chapter-count; font-size: 1em;}h2::before { content: "Chapter " counters(chapter-count, ".") ": ";}备注：计数器的值能够通过 CSS 属性counter-increment 控制递增或递减。
语法
css
/* Set counter-name to 0 */counter-reset: counter-name;/* Set counter-name to -1 */counter-reset: counter-name -1;/* Set counter1 to 1, and counter2 to 4 */counter-reset: counter1 1 counter2 4;/* Cancel any reset that could have been set in less specific rules */counter-reset: none;/* Global values */counter-reset: inherit;counter-reset: initial;counter-reset: unset;counter-reset 属性可以指定为以下之一：
<自定义 ID> [<数值>]。你可以指定任意数量的计数器进行重置，每个名称或“名称 - 数字”对之间用空格分隔。- 特殊值
none。
可选值
<custom-ident>要递增的计数器的名称。
备注：该名称由不区分大小写的字母 a 到 z，数字 0 到 9，下划线（_）和 / 或短划线（ - ）的组合组成，并且第一个非破折号字符必须是一个字母（即，在它的开头没有数字，即使前面有破折号）。此外，在标识符的开头禁止使用两个破折号。在任何案例组合中都不能是 none，unset，initial 或 inherit。
语法形式
counter-reset =
[<counter-name><integer>?|<reversed-counter-name><integer>?]+|
none
<counter-name> =
<custom-ident>
<integer> =
<number-token>
<reversed-counter-name> =
reversed(<counter-name>)
示例
css
h1 { counter-reset: chapter section 1 page; /* Sets the chapter and page counters to 0 and the section counter to 1. */}规范
| Specification |
|---|
| CSS Lists and Counters Module Level 3 # counter-reset |