diff options
Diffstat (limited to 'files/ja/web/css/custom-ident/index.html')
-rw-r--r-- | files/ja/web/css/custom-ident/index.html | 134 |
1 files changed, 134 insertions, 0 deletions
diff --git a/files/ja/web/css/custom-ident/index.html b/files/ja/web/css/custom-ident/index.html new file mode 100644 index 0000000000..0770a40aac --- /dev/null +++ b/files/ja/web/css/custom-ident/index.html @@ -0,0 +1,134 @@ +--- +title: <custom-ident> +slug: Web/CSS/custom-ident +tags: + - CSS + - CSS Data Type + - Data Type + - Layout + - Reference + - Web +translation_of: Web/CSS/custom-ident +--- +<div>{{CSSRef}}</div> + +<p><strong><code><custom-ident></code></strong> は <a href="/ja/docs/Web/CSS">CSS</a> の<a href="/ja/docs/Web/CSS/CSS_Types">データ型</a>で、{{glossary("identifier", "識別子")}}として使われるユーザー定義の任意の文字列を意味します。これは大文字と小文字を区別し、曖昧さを避けるため、いくつかの値は様々なコンテキストで禁止されています。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<p><code><custom-ident></code> の構文は CSS の識別子 (プロパティ名など) に似ていますが、<a class="external" href="https://ja.wikipedia.org/wiki/%E3%82%B1%E3%83%BC%E3%82%B9%E3%83%BB%E3%82%BB%E3%83%B3%E3%82%B7%E3%83%86%E3%82%A3%E3%83%96">大文字と小文字を区別</a>する点が違います。これは次の文字から成る文字の並びです:</p> + +<ul> + <li>任意のアルファベット (<code>A</code>-<code>Z</code>, <code>a</code>-<code>z</code>)</li> + <li>任意の数字 (<code>0</code>-<code>9</code>)</li> + <li>ハイフン (<code>-</code>)</li> + <li>アンダースコア (<code>_</code>)</li> + <li>エスケープ文字 (バックスラッシュ <code>\</code> に続く)</li> + <li><a href="http://ja.wikipedia.org/wiki/Unicode">Unicode</a> 文字 (バックスラッシュ <code>\</code> と、それに続く 1 - 6 個の16進値の形式をとる、Unicode コードポイント)</li> +</ul> + +<p>このデータ値は<a class="external" href="https://ja.wikipedia.org/wiki/%E3%82%B1%E3%83%BC%E3%82%B9%E3%83%BB%E3%82%BB%E3%83%B3%E3%82%B7%E3%83%86%E3%82%A3%E3%83%96">大文字と小文字を区別</a>するため、<code>id1</code>、<code>Id1</code>、<code>iD1</code>、<code>ID1</code> はすべて異なった識別子です。逆に、別のエスケープ方式を使っていますが、 <code>toto\?</code> と <code>toto\3F</code> は同じ識別子です。</p> + +<h3 id="Forbidden_values" name="Forbidden_values">禁止されている値</h3> + +<p><code><custom-ident></code> を引用符または二重引用符の間に置いてはいけません。こうすると、 {{CSSxRef("<string>")}} として識別されてしまいます。さらに、先頭の文字は、数字やハイフン (<code>-</code>) および、それら続くものであってはなりません。</p> + +<p>曖昧さを避けるため、 <code><custom-ident></code> を使用する各プロパティは、特定の値の使用を禁止しています:</p> + +<dl> + <dt>{{CSSxRef("animation-name")}}</dt> + <dd>グローバル CSS 値 (<code>unset</code>、 <code>initial</code>、そして <code>inherit</code>) を禁止し、 <code>none</code> も禁止しています。</dd> + <dt>{{CSSxRef("counter-reset")}}</dt> + <dt>{{CSSxRef("counter-increment")}}</dt> + <dd>グローバル CSS 値 (<code>unset</code>、 <code>initial</code>、そして <code>inherit</code>) を禁止し、 <code>none</code> も禁止しています。</dd> + <dt>{{CSSxRef("@counter-style")}}</dt> + <dt>{{CSSxRef("list-style-type")}}</dt> + <dd>グローバル CSS 値 (<code>unset</code>、 <code>initial</code>、そして <code>inherit</code>) および <code>none</code>、 <code>inline</code> 、そして <code>outside</code> の値を禁止しています。また、かなりの数の定義済みの値が様々なブラウザーに実装されています: <code>disc</code>, <code>circle</code>, <code>square</code>, <code>decimal</code>, <code>cjk-decimal</code>, <code>decimal-leading-zero</code>, <code>lower-roman</code>, <code>upper-roman</code>, <code>lower-greek</code>, <code>lower-alpha</code>, <code>lower-latin</code>, <code>upper-alpha</code>, <code>upper-latin</code>, <code>arabic-indic</code>, <code>armenian</code>, <code>bengali</code>, <code>cambodian</code>, <code>cjk-earthly-branch</code>, <code>cjk-heavenly-stem</code>, <code>cjk-ideographic</code>, <code>devanagari</code>, <code>ethiopic-numeric</code>, <code>georgian</code>, <code>gujarati</code>, <code>gurmukhi</code>, <code>hebrew</code>, <code>hiragana</code>, <code>hiragana-iroha</code>, <code>japanese-formal</code>, <code>japanese-informal</code>, <code>kannada</code>, <code>katakana</code>, <code>katakana-iroha</code>, <code>khmer</code>, <code>korean-hangul-formal</code>, <code>korean-hanja-formal</code>, <code>korean-hanja-informal</code>, <code>lao</code>, <code>lower-armenian</code>, <code>malayalam</code>, <code>mongolian</code>, <code>myanmar</code>, <code>oriya</code>, <code>persian</code>, <code>simp-chinese-formal</code>, <code>simp-chinese-informal</code>, <code>tamil</code>, <code>telugu</code>, <code>thai</code>, <code>tibetan</code>, <code>trad-chinese-formal</code>, <code>trad-chinese-informal</code>, <code>upper-armenian</code>, <code>disclosure-open</code>, and <code>disclosure-close</code>.</dd> + <dt>{{CSSxRef("grid-row-start")}}<br> + {{CSSxRef("grid-row-end")}}<br> + {{CSSxRef("grid-column-start")}}<br> + {{CSSxRef("grid-column-end")}}</dt> + <dd><code>span</code> 値を禁止しています。</dd> + <dt>{{CSSxRef("will-change")}}</dt> + <dd>グローバル CSS 値 (<code>unset</code>、 <code>initial</code>、そして <code>inherit</code>) および <code>will-change</code>、 <code>auto</code>、 <code>scroll-position</code> そして <code>contents</code> の値を禁止しています。</dd> +</dl> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Valid_identifiers" name="Valid_identifiers">有効な識別子</h3> + +<pre class="notranslate">nono79 アルファベットと数字の組み合わせ +ground-level アルファベットとダッシュの組み合わせ +-test ダッシュとそれに続くアルファベット +_internal アンダースコアとそれに続くアルファベット +\22 toto Unicode 文字とそれに続くアルファベット +bili\.bob ピリオドは正しくエスケープされています +</pre> + +<h3 id="Invalid_identifiers" name="Invalid_identifiers">無効な識別子</h3> + +<pre class="notranslate">34rem 数字で始まってはいけません +-12rad ダッシュで始まって数字が続いてはいけません +bili.bob アルファベットと数字以外でエスケープせずに使えるのは _ と - だけです +--toto 2 つのダッシュで始まってはいけません +'bilibob' <string> です +"bilibob" <string> です</pre> + +<h2 id="Specifications" name="Specifications">仕様書</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('CSS4 Values', '#custom-idents', '<code><custom-ident></code>')}}</td> + <td>{{Spec2('CSS4 Values')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('CSS Will Change', '#valdef-will-change-custom-ident', '<code><custom-ident></code> for <code>will-change</code>')}}</td> + <td>{{Spec2('CSS Will Change')}}</td> + <td>{{CSSxRef("will-change")}} で除外する値を定義。</td> + </tr> + <tr> + <td>{{SpecName('CSS3 Counter Styles', '#typedef-counter-style-name', '<code><custom-ident></code> for <code>list-style-type</code>')}}</td> + <td>{{Spec2('CSS3 Counter Styles')}}</td> + <td>キーワードの有限リストの代わりに <code><custom-ident></code> を使用。 {{CSSxRef("list-style-type")}} と {{CSSxRef("@counter-style")}} で除外する値を定義。</td> + </tr> + <tr> + <td>{{SpecName('CSS3 Lists', '#counter-properties', '<code><custom-ident></code> for <code>counter-*</code>')}}</td> + <td>{{Spec2('CSS3 Lists')}}</td> + <td><code><identifier></code> から <code><custom-ident></code> へ改名。使い方を新しい <code>counter-set</code> プロパティへ追加。</td> + </tr> + <tr> + <td>{{SpecName('CSS3 Animations', '#typedef-single-animation-name', '<code><custom-ident></code> for <code>animation-name</code>')}}</td> + <td>{{Spec2('CSS3 Animations')}}</td> + <td>{{CSSxRef("animation-name")}} で除外する値を定義。</td> + </tr> + <tr> + <td>{{SpecName('CSS3 Values', '#custom-idents', '<code><custom-ident></code>')}}</td> + <td>{{Spec2('CSS3 Values')}}</td> + <td><code><identifier></code> から <code><custom-ident></code> へ改名。擬似型とし、除外値の使用を禁止した。</td> + </tr> + <tr> + <td>{{SpecName('CSS2.1', 'syndata.html#value-def-identifier', '<code><identifier></code>')}}</td> + <td>{{Spec2('CSS2.1')}}</td> + <td>初回定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<p><em>このデータ型は実際の型ではありませんが、許可された値をシンプルに記述するのに役立つ便利な型です。ブラウザーの互換性についての情報はありません。</em></p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{CSSxRef("<ident>")}}</li> +</ul> |