From f5f367270e2d0334f542cc755a2f7b00ba2e59b3 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Sun, 19 Dec 2021 15:52:39 +0900 Subject: 2021/08/13 時点の英語版に基づき新規翻訳 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/css/@counter-style/negative/index.md | 89 +++++++++++++++++++++++ 1 file changed, 89 insertions(+) create mode 100644 files/ja/web/css/@counter-style/negative/index.md (limited to 'files/ja/web') diff --git a/files/ja/web/css/@counter-style/negative/index.md b/files/ja/web/css/@counter-style/negative/index.md new file mode 100644 index 0000000000..c9f9c5ddd0 --- /dev/null +++ b/files/ja/web/css/@counter-style/negative/index.md @@ -0,0 +1,89 @@ +--- +title: negative +slug: Web/CSS/@counter-style/negative +tags: + - '@counter-style' + - アットルール記述子 + - CSS + - CSS 記述子 + - リファレンス +browser-compat: css.at-rules.counter-style.negative +translation_of: Web/CSS/@counter-style/negative +--- +{{CSSRef}} + +カスタムカウンターのスタイルを定義する際、 **`negative`** 記述子により、値が負のときにカウンターの表現に付加または前置する記号を指定する方法を提供することで、負のカウンターの表現を変更することができます。 + +## 構文 + +```css +/* 値 */ +negative: "-"; /* 負の値の場合に先頭に '-' を付ける */ +negative: "(" ")"; /* 負の値の場合に '(' と ')' で囲む */ +``` + +### Values + +- first `` + - : カウンターが負の時に、この記号がその表現の前に付きます。 +- second `` + - : 存在する場合、カウンターが負の時に、この記号がその表現の後に追加されます。 + +## 解説 + +カウンターの値が負の場合、記述子の値として指定された記号がカウンター表現の前に置かれ、指定された場合は 2 番目の記号が表現の後に追加されます。 negative 記述子は、 `system` の値が `symbolic`, `alphabetic`, `numeric`, `additive`, `extends` の何れかで、拡張カウンタースタイル自体が負の符号を使用している場合のみ有効になります。負のカウンター値に対応していない他のシステムで negative 記述子が指定された場合、その記述子は無視されます。 + +## 公式定義 + +{{cssinfo}} + +## 形式文法 + +{{csssyntax}} + +## 例 + +### 負のカウンターを描画する + +#### HTML + +```html +
    +
  1. One
  2. Two
  3. Three
  4. Four
  5. Five
  6. +
+``` + +#### CSS + +```css +@counter-style neg { + system: numeric; + symbols: "0" "1" "2" "3" "4" "5" "6" "7" "8" "9"; + negative: "(-" ")"; +} + +.list { + list-style: neg; +} +``` + +#### 結果 + +{{ EmbedLiveSample('Rendering_negative_counters', '', '', '', 'Web/CSS/@counter-style/negative') }} + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{Cssxref("list-style")}}, {{Cssxref("list-style-image")}}, {{Cssxref("list-style-position")}} +- {{cssxref("symbols()")}}, 無名のカウンタースタイルを生成する関数記法。 -- cgit v1.2.3-54-g00ecf