CSS @counter-style 規則
- 上一页 counter-set
- 下一页 cursor
定義と使用方法
CSS @counter-style
この規則はカスタムカウンタースタイルの定義に使用されます。
既定のスタイルが要件に合わない場合に、@counter-style
この規則は、カスタムカウンタースタイルを定義することができます。
例
リストにカスタムカウンタースタイルを指定します:
@counter-style crown { system: cyclic; symbols: "\1F451"; suffix: " "; { ul { list-style: crown; {
CSS 语法
@counter-style 値 CSS 文法 @counter-style {
one or more descriptors
} | 属性値 |
---|---|
値 |
説明 countername |
カウンタスタイルの大文字小文字を区別する名前を定義します。 |
注意:カウンタ名はnone、decimal、disc、square、circle、disclosure-openまたはdisclosure-closedではありません。 system systemがcyclic、numeric、alphabetic、symbolicまたはfixedに設定されている場合、symbolsディスクリプタが必要です。 |
symbols |
systemがadditiveに設定されている場合、additive-symbolsディスクリプタが必要です。 symbols systemディスクリプタがcyclic、numeric、alphabetic、symbolicまたはfixedに設定されている場合、必須です。 |
HTML UTF-8 シンボル |
additive-symbols 加法カウンターシステム(例えば、ローマ数字)は、一連の加重シンボルで構成されています。 重みが降順に並べられたカウンタシンボル及其非負整数ウェイトのリストがディスクリプタです。 systemディスクリプタがadditiveに設定されている場合、必須です。 |
negative | 値が負数の場合にタグ表示に追加されるべき接頭辞または接尾辞を定義します。 |
prefix | タグ表示に追加されるべき接頭辞を定義します。 |
suffix | タグ表示に追加されるべき接尾辞を定義します。 |
range |
カウンタスタイルの値範囲を定義します。 カウンタ値が範囲を超えた場合、サブスタイルにリトライします。 |
pad |
タグが最小長さを持つ必要がある場合に使用します。 例えば、カウンタが01から始まり、02、03、04などと続くように希望する場合、パッドディスクリプタを使用します。 指定されたパッド値を超えるカウンタの場合、タグは通常構築されます。 |
speak-as |
音声合成器がカウンタスタイルを読み出す方法を定義します。 例えば、順序付きリストの場合は数字またはアルファベットで読み、無秩序リストの場合はオーディオヒントで読みます。 |
fallback |
システムがタグを構築できないまたは指定範囲を超えた場合のリトライのカウンタ名を定義します。 サブカウンターやサブシステムがカウンタ値を表現できない場合、デシマルスタイルにリトライします。 |
ブラウザのサポート
テーブルの数字は、@ルールを完全にサポートする最初のブラウザのバージョンを示しています。
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
91 | 91 | 33 | 17 | 77 |
- 上一页 counter-set
- 下一页 cursor