例
セクションおよびサブセクションに番号を付ける方法"Section 1" 、 "1.1" 、 "1.2" 、など：
body
{
counter-reset: section;
}
h1
{
counter-reset: subsection;
}
h1:before
{
counter-increment: section;
content: "Section " counter(section) ". ";
}
h2:before
{
counter-increment: subsection;
content: counter(section) "." counter(subsection) " ";
}
»それを自分で試してみてください 定義と使用法
カウンターリセットプロパティが作成または1つ以上のカウンタをリセットします。
カウンターリセットプロパティは、通常、カウンタインクリメントプロパティやコンテンツプロパティと一緒に使用されます。
| デフォルト値： | none |
|---|---|
| 継承されました： | no |
| アニメーション： | no. Read about animatable |
| バージョン： | CSS2 |
| JavaScriptシンタックス： | object .style.counterReset="section" Try it |
ブラウザのサポート
表中の数字は完全にプロパティをサポートする最初のブラウザのバージョンを指定します。
| プロパティ | |||||
|---|---|---|---|---|---|
| counter-reset | 4.0 | 8.0 | 2.0 | 3.1 | 9.6 |
Note: ！のIE8は、DOCTYPEが指定されている場合にのみ、カウンタリセットプロパティをサポートしています。
CSSの構文
counter-reset: none|name number|initial|inherit;プロパティ値
| 値 | 説明 |
|---|---|
| none | デフォルト値。 いいえカウンタはリセットされません |
| name | nameリセットすべきことは、どのカウンタを定義します |
| number | idリセットされるべきカウンタを定義します。 numberカウンタは、セレクタの出現毎にに設定されている値を設定します。 デフォルトのリセット値は0であります |
| initial | このプロパティがデフォルト値に設定します。 初期についての記事を読みます |
| inherit | その親要素からこのプロパティを継承します。 継承についての記事を読みます |
関連ページ
CSSリファレンス： ：擬似要素の前に
CSSリファレンス： ：擬似要素の後
CSSリファレンス： content property
CSSリファレンス： counter-increment property
HTML DOMリファレンス： counterReset property