From b8cc946f62c0f13bdd29675c20bfeffcd6e8bbac Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Mon, 3 Jan 2022 13:25:31 +0900 Subject: 擬似クラス/擬似要素の文書を変換準備 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/css/pseudo-elements/index.html | 125 ---------------------------- files/ja/web/css/pseudo-elements/index.md | 125 ++++++++++++++++++++++++++++ 2 files changed, 125 insertions(+), 125 deletions(-) delete mode 100644 files/ja/web/css/pseudo-elements/index.html create mode 100644 files/ja/web/css/pseudo-elements/index.md (limited to 'files/ja/web/css/pseudo-elements') diff --git a/files/ja/web/css/pseudo-elements/index.html b/files/ja/web/css/pseudo-elements/index.html deleted file mode 100644 index d46d32bce6..0000000000 --- a/files/ja/web/css/pseudo-elements/index.html +++ /dev/null @@ -1,125 +0,0 @@ ---- -title: 擬似要素 (Pseudo-elements) -slug: Web/CSS/Pseudo-elements -tags: - - CSS - - Guide - - Overview - - Pseudo-element - - Reference - - Selectors -translation_of: Web/CSS/Pseudo-elements ---- -
{{CSSRef}}
- -

CSS の 擬似要素 (Pseudo-elements) はセレクターに付加するキーワードで、選択された要素の特定の部分にスタイル付けできるようにするものです。例えば {{CSSxRef("::first-line")}} 擬似要素は、段落の最初の行のフォントを変更するために使用することができます。

- -
/* 各 <p> 要素の最初の行です。 */
-p::first-line {
-  color: blue;
-  text-transform: uppercase;
-}
- -
-

注: 擬似要素とは対照的に、{{CSSxRef("pseudo-classes", "擬似クラス")}}は要素の状態に基づいてスタイル付けを行うことができます。

-
- -

構文

- -
selector::pseudo-element {
-  property: value;
-}
- -

擬似要素は1つのセレクターに1つだけ使用することができます。文内の単純セレクターの後に置く必要があります。

- -
-

注: 規則として、単一コロン (:) の代わりに二重コロン (::) を使用してください。これで擬似要素と擬似クラスを区別します。但し、この区別は W3C の古いバージョンの仕様書には存在しなかったため、多くのブラウザーは元々の擬似要素に対して両方の文法に対応しています。

-
- -

標準の擬似要素の索引

- -
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
ブラウザー対応開始バージョン対応内容
Internet Explorer8.0:pseudo-element
9.0:pseudo-element ::pseudo-element
Firefox (Gecko)1.0 (1.0):pseudo-element
1.0 (1.5):pseudo-element ::pseudo-element
Opera4.0:pseudo-element
7.0:pseudo-element ::pseudo-element
Safari (WebKit)1.0 (85):pseudo-element ::pseudo-element
- -

仕様書

- - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName("CSS1")}}{{Spec2("CSS1")}}擬似クラスと擬似要素を定義した。
- -

関連情報

- - diff --git a/files/ja/web/css/pseudo-elements/index.md b/files/ja/web/css/pseudo-elements/index.md new file mode 100644 index 0000000000..d46d32bce6 --- /dev/null +++ b/files/ja/web/css/pseudo-elements/index.md @@ -0,0 +1,125 @@ +--- +title: 擬似要素 (Pseudo-elements) +slug: Web/CSS/Pseudo-elements +tags: + - CSS + - Guide + - Overview + - Pseudo-element + - Reference + - Selectors +translation_of: Web/CSS/Pseudo-elements +--- +
{{CSSRef}}
+ +

CSS の 擬似要素 (Pseudo-elements) はセレクターに付加するキーワードで、選択された要素の特定の部分にスタイル付けできるようにするものです。例えば {{CSSxRef("::first-line")}} 擬似要素は、段落の最初の行のフォントを変更するために使用することができます。

+ +
/* 各 <p> 要素の最初の行です。 */
+p::first-line {
+  color: blue;
+  text-transform: uppercase;
+}
+ +
+

注: 擬似要素とは対照的に、{{CSSxRef("pseudo-classes", "擬似クラス")}}は要素の状態に基づいてスタイル付けを行うことができます。

+
+ +

構文

+ +
selector::pseudo-element {
+  property: value;
+}
+ +

擬似要素は1つのセレクターに1つだけ使用することができます。文内の単純セレクターの後に置く必要があります。

+ +
+

注: 規則として、単一コロン (:) の代わりに二重コロン (::) を使用してください。これで擬似要素と擬似クラスを区別します。但し、この区別は W3C の古いバージョンの仕様書には存在しなかったため、多くのブラウザーは元々の擬似要素に対して両方の文法に対応しています。

+
+ +

標準の擬似要素の索引

+ +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ブラウザー対応開始バージョン対応内容
Internet Explorer8.0:pseudo-element
9.0:pseudo-element ::pseudo-element
Firefox (Gecko)1.0 (1.0):pseudo-element
1.0 (1.5):pseudo-element ::pseudo-element
Opera4.0:pseudo-element
7.0:pseudo-element ::pseudo-element
Safari (WebKit)1.0 (85):pseudo-element ::pseudo-element
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSS1")}}{{Spec2("CSS1")}}擬似クラスと擬似要素を定義した。
+ +

関連情報

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