CSS3

@規則用記述子

symbols

  編集:2022.07.13 by T.A.

[Edge]○。→mdn

リスト マーカの文字などの定義。

名前 symbols
用途 @counter-style
<symbol>+
初期値 なし

以下のCSSが組み込んであります:

<symbol>
<string> | <image> | <custom-ident>
<OL style="list-style:Test_Cunt;">
 <LI>LI1
 <LI>LI2
 <LI>LI3
 <LI>LI4
 <LI>LI5
 <LI>LI6
</OL>
¶<image>、<custom-ident>できなかった

<OL style="list-style:Test_CuntUrl;">
 <LI>LI1
 <LI>LI2
</OL>
<image>が1つでもだめ

<OL style="list-style:Test_CuntCI;">
 <LI>LI1
 <LI>LI2
</OL>
<custom-ident>が1つでもだめ

[symbols/additive-symbols]記述子の値を成す各 <symbol> は、[system 記述子で指定される マーカ構築アルゴリズム]に利用される一連の記号 ― カウンター記号 ― を指定する。symbols 記述子は、カウンター システムが[cyclicnumericalphabeticsymbolicfixed]の場合には指定されなければならない。

一部のカウンター システムでは、symbols 記述子に 2 個以上のエントリが要求されている ― 1 個しかない場合、その記述子は無効になり、無視されるものとする。

symbols 記述子内のカウンター記号の解釈は、カウンター スタイルのシステムに応じて異なる。

カウンター記号は、[文字列(<string>)、画像(<image>)、識別子(<custom-ident>)]いずれかをとり、この 3 種を単独の記述子に混在させることもできる。
カウンター表現は、カウンター記号をいくつか連結して構築される。識別子は、同じ文字を包含する文字列として具現化される。画像は行内レベルの置換要素として具現化される。画像によるカウンター記号の既定のオブジェクト サイズは 1em 平方になる。

注記: <symbol> における <image> 構文は、現在はリスク下にある。現在、それを実装しようと計画している実装は無い上、counter() の一部の用法を全部的に取り扱わない仕方で複雑化させる。

注記: 文字列でなく識別子を利用して記号を定義するときは、識別子の構文に注意。特に、"*"の様な普通字でない ASCII は、識別子でないので、引用符で括って文字列にしなければならない。
この仕様で定義されるカウンター スタイルのうち一部で利用される 16 進エスケープは、(その後に数字を続けても多義的にならないようにするため)直後のスペースを“食べる”ので、その直後の数字と分離するためには、スペースを 2 個挟む必要がある ― さもなければ、同じ識別子内の隣接する一部分と見なされることになる。
例えば symbols: \660 \661; は、文字 U+0660、U+0661 からなる単独の記号を定義する ― 2 個の文字を定義するためには、symbols: "\660" "\661" の様にエスケープされた各 文字を引用符で括るか、それらの合間に 2 個のスペースを挟む必要がある。


テスト
HTML:

ここに表示
HTML:

ここに表示
スクリプト:


スクリプト:



表示内容:
表示内容: