From 7a21835fa37c9b03df26a0ddb876b3289b86aa5d Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 21 Dec 2021 01:50:47 +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/suffix/index.md | 83 +++++++++++++++++++++++++ 1 file changed, 83 insertions(+) create mode 100644 files/ja/web/css/@counter-style/suffix/index.md (limited to 'files') diff --git a/files/ja/web/css/@counter-style/suffix/index.md b/files/ja/web/css/@counter-style/suffix/index.md new file mode 100644 index 0000000000..22aaffb7c8 --- /dev/null +++ b/files/ja/web/css/@counter-style/suffix/index.md @@ -0,0 +1,83 @@ +--- +title: suffix +slug: Web/CSS/@counter-style/suffix +tags: + - '@counter-style' + - アットルール記述子 + - CSS + - CSS カウンタースタイル + - CSS 記述子 + - リファレンス +browser-compat: css.at-rules.counter-style.suffix +--- +{{CSSRef}} + +**`suffix`** は {{cssxref("@counter-style")}} ルールの記述子で、マーカーの表現に追加されるものを指定します。 + +## 構文 + +```css +/* values */ +suffix: ""; +suffix: ") "; +suffix: url(bullet.png); +``` + +### 値 + +- `` + - : マーカー表現に追加される記号を指定します。 {{cssxref("<string>")}}, {{cssxref("<image>")}}, {{cssxref("<custom-ident>")}} が指定できます。 + +## 公式定義 + +{{cssinfo}} + +## 形式文法 + +{{csssyntax}} + +## 例 + +### カウンターの接尾辞を設定 + +#### HTML + +```html +
    +
  • One
  • +
  • Two
  • +
  • Three
  • +
  • None of the above
  • +
+``` + +#### CSS + +```css +@counter-style options { + system: fixed; + symbols: A B C D; + suffix: ") "; +} + +.choices { + list-style: options; +} +``` + +#### 結果 + +{{ EmbedLiveSample('Setting_a_suffix_for_a_counter')}} + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{Cssxref("list-style")}}, {{Cssxref("list-style-image")}}, {{Cssxref("list-style-position")}} +- {{cssxref("symbols()")}}, 無名のカウンタースタイルを生成する関数記法 -- cgit v1.2.3-54-g00ecf