From 9bf6693b2edd5281c1577856895c55653a41dc01 Mon Sep 17 00:00:00 2001 From: MDN Date: Sat, 19 Mar 2022 00:13:08 +0000 Subject: [CRON] sync translated content --- files/ja/web/css/symbols/index.md | 68 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 68 insertions(+) create mode 100644 files/ja/web/css/symbols/index.md (limited to 'files/ja/web/css/symbols') diff --git a/files/ja/web/css/symbols/index.md b/files/ja/web/css/symbols/index.md new file mode 100644 index 0000000000..c8abc9d9ec --- /dev/null +++ b/files/ja/web/css/symbols/index.md @@ -0,0 +1,68 @@ +--- +title: symbols() +slug: Web/CSS/symbols +tags: + - CSS + - CSS カウンタースタイル + - Function + - リファレンス +translation_of: Web/CSS/symbols() +original_slug: Web/CSS/symbols() +browser-compat: css.properties.list-style-type.symbols +--- +{{CSSRef}} + +**`symbols()`** は CSS の関数で、カウンタースタイルをインラインで、 {{cssxref("list-style")}} のようなプロパティの値で直接定義することができます。 {{cssxref("@counter-style")}} とは異なり、 `symbols()` は*無名*です (すなわち一度しか使用できません)。 {{cssxref("@counter-style")}} よりも機能は劣りますが、より簡単でより短く書くことができます。 + +## 構文 + +```css +symbols() = symbols( ? [ | ]+ ); +``` + +`` は以下のうちの一つで指定することができます。 + +- `cyclic`: このシステムでは、与えられた値を定義された順に循環させ、最後に到達すると最初に戻ります。 +- `numeric`: このシステムでは、与えられた値を位取り記数法の連続した単位として解釈します。 +- `alphabetic`: このシステムでは、与えられた値をアルファベット記数法として解釈します。位取り記数法と似ていますが、 `0` がありません。 +- `symbolic`: このシステムでは値を循環させ、循環ごとに数を増やします(最初の循環では 1 回、 2 回目は 2 回、など)。 +- `fixed`: このシステムでは与えられた値を一度ずつ使用し、その後はアラビア数字で代替します。 + +## 例 + +### HTML + +```html +
    +
  1. One
  2. +
  3. Two
  4. +
  5. Three
  6. +
  7. Four
  8. +
  9. Five
  10. +
+``` + +### CSS + +```css +ol { + list-style: symbols(cyclic "*" "†" "‡"); +} +``` + +### 結果 + +{{EmbedLiveSample('Examples','100%',200)}} + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{cssxref("@counter-style")}} +- {{cssxref("list-style-type")}} および対応する一括指定である {{cssxref("list-style")}} -- cgit v1.2.3-54-g00ecf