CSS counter() 函式
示例
為頁面建立一個計數器（在 body 選擇器中）。為每個 <h2> 元素遞增計數器值，並在每個 <h2> 元素前新增文字“Section <計數器值>:”
body {
counter-reset: section;
}
h2::before {
counter-increment: section;
content: "Section " counter(section) ": ";
}
自己動手試一試 »
更多“自己嘗試”的例子見下文。
定義和用法
counter() 函式返回命名計數器的當前值，作為字串。
| 版本 | CSS3 |
|---|
瀏覽器支援
| 函式 | |||||
|---|---|---|---|---|---|
| counter() | 是 | 是 | 是 | 是 | 是 |
CSS 語法
counter(countername, counterstyle)
| 值 | 描述 |
|---|---|
| countername | 必需。計數器的名稱（與用於 counter-reset 和 counter-increment 屬性的名稱相同） |
| counterstyle | 可選。計數器的樣式（可以是 list-style-type 值） |
更多示例
示例
設定計數器的樣式
body {
counter-reset: section;
}
h2::before {
counter-increment: section;
content: "Section " counter(section, upper-roman) ": ";
}
自己動手試一試 »
相關頁面
CSS 參考：content 屬性
CSS 參考：counter-increment 屬性
CSS 參考：counter-reset 屬性
