diff options
author | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2022-01-27 23:24:28 +0900 |
---|---|---|
committer | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2022-02-03 21:44:19 +0900 |
commit | bab7d77f3dc33240220ad2a32cbcc81bf921d75a (patch) | |
tree | c760d988e2de15a92248743ced9b3e91927b88ee /files/ja | |
parent | 64418fb735d0dd8f7a4b0dbfa30692cb7ba3ffb4 (diff) | |
download | translated-content-bab7d77f3dc33240220ad2a32cbcc81bf921d75a.tar.gz translated-content-bab7d77f3dc33240220ad2a32cbcc81bf921d75a.tar.bz2 translated-content-bab7d77f3dc33240220ad2a32cbcc81bf921d75a.zip |
2021/10/04 時点の英語版に同期
Diffstat (limited to 'files/ja')
-rw-r--r-- | files/ja/web/css/counter-set/index.md | 100 |
1 files changed, 44 insertions, 56 deletions
diff --git a/files/ja/web/css/counter-set/index.md b/files/ja/web/css/counter-set/index.md index d67986bab9..c03ec24f45 100644 --- a/files/ja/web/css/counter-set/index.md +++ b/files/ja/web/css/counter-set/index.md @@ -3,100 +3,88 @@ title: counter-set slug: Web/CSS/counter-set tags: - CSS - - CSS Counter - - CSS Lists - - CSS Property + - CSS カウンター + - CSS リスト + - CSS プロパティ + - recipe:css-property +browser-compat: css.properties.counter-set translation_of: Web/CSS/counter-set --- {{CSSRef}} -<span class="seoSummary">[CSS](/ja/docs/Web/CSS)属性**`counter-set`**は,[CSS計数](/ja/docs/Web/Guide/CSS/Counters)を指定した値に設定します。当属性は存在する計数を操作し,新しい計数を作成するのは指定された名前の計数が要素に未だ存在しない場合のみです。</span> +**`counter-set`** は [CSS](/ja/docs/Web/CSS) のプロパティで、[CSS カウンター](/ja/docs/Web/CSS/CSS_Counter_Styles/Using_CSS_counters)を指定された値に設定します。これは既存のカウンターの値を操作し、その要素に指定された名前のカウンターがまだ存在しない場合は新しいカウンターを生成します。 -<div class="note"> -**注意:** 計数値の増減分にはCSS属性{{cssxref("counter-increment")}}を用いることもできます。 -</div> +> **Note:** カウンターの値は {{cssxref("counter-increment")}} プロパティを使用して増減させることができます。 -<h2 id="構文">構文</h2> +## 構文 -<pre class="brush:css no-line-numbers">/* "my-counter"を0に設定 */ +```css +/* "my-counter" を 0 に設定 */ counter-set: my-counter; -/* "my-counter"を-1に設定 */ +/* "my-counter" を -1 に設定 */ counter-set: my-counter -1; -/* "counter1"を1に,"counter2"を4に設定 */ +/* "counter1" を 1 に、 "counter2" を 4 に設定 */ counter-set: counter1 1 counter2 4; -/* これより詳細度が低い規則で設定される全計数を消去する */ +/* より詳細度が低いルールで設定されたカウンターをすべて消去 */ counter-set: none; -/* 大域値 */ +/* グローバル値 */ counter-set: inherit; counter-set: initial; +counter-set: revert; counter-set: unset; -</pre> +``` -`counter-set`属性には次の内どれかを指定します。 +`counter-set` プロパティは、以下のうちの何れかで指定します。 -- 計数名`<custom-ident>`に引き続く任意の`<integer>`。指定できる計数の個数に制限はなく,それぞれを空白で区切って指定します。 -- 予約語`none`。 +- カウンターの名前を指定する `<custom-ident>` と、それに続く任意の `<integer>`。カウンターはいくつでも指定することができ、それぞれの名前や名前と数値の組は空白で区切ります。 +- キーワード値 `none`。 -<h3 id="値">値</h3> +### 値 - {{cssxref("custom-ident", "<custom-ident>")}} - - : 設定する計数名。 + - : 設定するカウンターの名前です。 - {{cssxref("<integer>")}} - - : この値が,〔当CSSが規則を適用する〕要素が現れる度に計数を設定します。指定なき場合の既定値は0です。指定した名前の計数が現在要素に存在しない場合,その要素に指定された名前の計数を初期値0で新たに作成します(ただし,作成の後,速やかに他の値に設定又は増分されます)。 + - : この要素が現れるたびにカウンターに設定する値です。指定されなかった場合の既定値は `0` です。現在、この要素に指定された名前のカウンターが存在しない場合、この要素は指定された名前の新しいカウンターを、開始値 0 で指定します(ただし、その後で直ちに異なる値に設定されたり増加したりする可能性があります)。 - `none` - - : いかなる計数の設定も行いません。より詳細度の低い規則で定めた`counter-set`を上書きするのに使えるでしょう。 + - : カウンターの設定は行われません。これはより詳細度の低い規則によって定義された `counter-set` を上書きするために使用することができます。 -<h3 id="形式文法">形式文法</h3> +## 公式定義 + +{{cssinfo}} + +## 形式文法 {{csssyntax}} -<h2 id="事例">事例</h2> +## 例 -<pre class="brush:css">h1 { +### 名前付きカウンターの設定 + +```css +h1 { counter-set: chapter section 1 page; - /* "chapter"及び"page"計数を0に, - "section"計数を1に設定 */ + /* chapter および page のカウンターを 0 に、 + section カウンターを 1 に設定 */ } -</pre> - -<h2 id="仕様書">仕様書</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">仕様書</th> - <th scope="col">状態</th> - <th scope="col">備考</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS3 Lists', '#propdef-counter-set', 'counter-set')}}</td> - <td>{{Spec2('CSS3 Lists')}}</td> - <td>初期定義</td> - </tr> - </tbody> -</table> - -{{cssinfo}} +``` -<h2 id="ブラウザ互換性">ブラウザ互換性</h2> +## 仕様書 -<div> +{{Specifications}} +## ブラウザーの互換性 -{{Compat("css.properties.counter-set")}} -</div> +{{Compat}} -<h2 id="関連項目">関連項目</h2> +## 関連情報 -- [CSSカウンタの使用](/ja/docs/CSS/Counters) +- [CSS カウンターの使用](/ja/docs/Web/CSS/CSS_Counter_Styles/Using_CSS_counters) - {{cssxref("counter-increment")}} - {{cssxref("counter-reset")}} - {{cssxref("@counter-style")}} -- {{cssxref("counter")}}及び{{cssxref("counters")}}関数 -- {{cssxref("content")}}属性 +- {{cssxref("counter()")}} および {{cssxref("counters()")}} 関数 +- {{cssxref("content")}} プロパティ |