From 4e7f38b255e10211ec0e438036bce18142fe0a0e Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Mon, 3 Jan 2022 15:47:20 +0900 Subject: 言語擬似クラス、位置擬似クラス、ユーザー操作擬似クラスを変換準備 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/css/_colon_lang/index.html | 103 -------------------------------- files/ja/web/css/_colon_lang/index.md | 103 ++++++++++++++++++++++++++++++++ 2 files changed, 103 insertions(+), 103 deletions(-) delete mode 100644 files/ja/web/css/_colon_lang/index.html create mode 100644 files/ja/web/css/_colon_lang/index.md (limited to 'files/ja/web/css/_colon_lang') diff --git a/files/ja/web/css/_colon_lang/index.html b/files/ja/web/css/_colon_lang/index.html deleted file mode 100644 index 2e0519a3f9..0000000000 --- a/files/ja/web/css/_colon_lang/index.html +++ /dev/null @@ -1,103 +0,0 @@ ---- -title: ':lang' -slug: 'Web/CSS/:lang' -tags: - - CSS - - Layout - - Pseudo-class - - Reference - - Selector - - Web -translation_of: 'Web/CSS/:lang' ---- -
{{CSSRef}}
- -

:lang() はCSS の擬似クラスで、指定された言語に基づいて要素に一致させます。

- -
/* <p> のうち English (en) のものをすべて選択 */
-p:lang(en) {
-  quotes: '\201C' '\201D' '\2018' '\2019';
-}
- -
-

メモ: HTML では、言語は {{htmlattrxref("lang")}} 属性と {{HTMLElement("meta")}} 要素、それに、可能であればプロトコルから得られる情報 (HTTP ヘッダーなど) の組み合わせで決められます。他の文書型では、文書の言語を決定する他の方法があるかもしれません。

-
- -

構文

- -

形式文法

- -{{csssyntax}} - -

引数

- -
-
<language-code>
-
{{cssxref("<string>")}} で、ターゲットにしたい言語を表します。受付可能な値は HTML 仕様書で定義されています。
-
- -

例

- -

この例では、 :lang() 疑似クラスを使用して引用要素 ({{htmlElement("q")}}) の親を選択するために 子結合子 を使用しています。なお、この例はこの目的のための唯一の方法でも、文書型における最適な方法を示しているわけでもありません。また、 {{glossary("Unicode")}} の値は特殊な引用符を指定するために使用していることに注意してください。

- -

HTML

- -
<div lang="en"><q>This English quote has a <q>nested</q> quote inside.</q></div>
-<div lang="fr"><q>This French quote has a <q>nested</q> quote inside.</q></div>
-<div lang="de"><q>This German quote has a <q>nested</q> quote inside.</q></div>
-
- -

CSS

- -
:lang(en) > q { quotes: '\201C' '\201D' '\2018' '\2019'; }
-:lang(fr) > q { quotes: '« ' ' »'; }
-:lang(de) > q { quotes: '»' '«' '\2039' '\203A'; }
-
- -

結果

- -

{{EmbedLiveSample('Examples', 350)}}

- -

仕様書

- - - - - - - - - - - - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName('CSS4 Selectors', '#lang-pseudo', ':lang()')}}{{Spec2('CSS4 Selectors')}}ワイルドカードによるマッチングとカンマ区切りの言語リストを追加。
{{SpecName('CSS3 Selectors', '#lang-pseudo', ':lang()')}}{{Spec2('CSS3 Selectors')}}有意な変更なし。
{{SpecName('CSS2.1', 'selector.html#lang', ':lang()')}}{{Spec2('CSS2.1')}}初回定義。
- -

ブラウザーの互換性

- -
-

{{Compat("css.selectors.lang")}}

-
- -

関連情報

- - diff --git a/files/ja/web/css/_colon_lang/index.md b/files/ja/web/css/_colon_lang/index.md new file mode 100644 index 0000000000..2e0519a3f9 --- /dev/null +++ b/files/ja/web/css/_colon_lang/index.md @@ -0,0 +1,103 @@ +--- +title: ':lang' +slug: 'Web/CSS/:lang' +tags: + - CSS + - Layout + - Pseudo-class + - Reference + - Selector + - Web +translation_of: 'Web/CSS/:lang' +--- +
{{CSSRef}}
+ +

:lang() はCSS の擬似クラスで、指定された言語に基づいて要素に一致させます。

+ +
/* <p> のうち English (en) のものをすべて選択 */
+p:lang(en) {
+  quotes: '\201C' '\201D' '\2018' '\2019';
+}
+ +
+

メモ: HTML では、言語は {{htmlattrxref("lang")}} 属性と {{HTMLElement("meta")}} 要素、それに、可能であればプロトコルから得られる情報 (HTTP ヘッダーなど) の組み合わせで決められます。他の文書型では、文書の言語を決定する他の方法があるかもしれません。

+
+ +

構文

+ +

形式文法

+ +{{csssyntax}} + +

引数

+ +
+
<language-code>
+
{{cssxref("<string>")}} で、ターゲットにしたい言語を表します。受付可能な値は HTML 仕様書で定義されています。
+
+ +

例

+ +

この例では、 :lang() 疑似クラスを使用して引用要素 ({{htmlElement("q")}}) の親を選択するために 子結合子 を使用しています。なお、この例はこの目的のための唯一の方法でも、文書型における最適な方法を示しているわけでもありません。また、 {{glossary("Unicode")}} の値は特殊な引用符を指定するために使用していることに注意してください。

+ +

HTML

+ +
<div lang="en"><q>This English quote has a <q>nested</q> quote inside.</q></div>
+<div lang="fr"><q>This French quote has a <q>nested</q> quote inside.</q></div>
+<div lang="de"><q>This German quote has a <q>nested</q> quote inside.</q></div>
+
+ +

CSS

+ +
:lang(en) > q { quotes: '\201C' '\201D' '\2018' '\2019'; }
+:lang(fr) > q { quotes: '« ' ' »'; }
+:lang(de) > q { quotes: '»' '«' '\2039' '\203A'; }
+
+ +

結果

+ +

{{EmbedLiveSample('Examples', 350)}}

+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSS4 Selectors', '#lang-pseudo', ':lang()')}}{{Spec2('CSS4 Selectors')}}ワイルドカードによるマッチングとカンマ区切りの言語リストを追加。
{{SpecName('CSS3 Selectors', '#lang-pseudo', ':lang()')}}{{Spec2('CSS3 Selectors')}}有意な変更なし。
{{SpecName('CSS2.1', 'selector.html#lang', ':lang()')}}{{Spec2('CSS2.1')}}初回定義。
+ +

ブラウザーの互換性

+ +
+

{{Compat("css.selectors.lang")}}

+
+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf