From efbecfdf46b8b4781884ab7fdf601a23c5e4a150 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Thu, 6 Jan 2022 02:01:28 +0900 Subject: 2021/08/13 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/css/universal_selectors/index.md | 126 ++++++++++++-------------- 1 file changed, 60 insertions(+), 66 deletions(-) diff --git a/files/ja/web/css/universal_selectors/index.md b/files/ja/web/css/universal_selectors/index.md index 7d273090c6..a5a7ff186c 100644 --- a/files/ja/web/css/universal_selectors/index.md +++ b/files/ja/web/css/universal_selectors/index.md @@ -3,39 +3,42 @@ title: 全称セレクター slug: Web/CSS/Universal_selectors tags: - CSS - - Reference - - Selectors + - リファレンス - セレクター +browser-compat: css.selectors.universal translation_of: Web/CSS/Universal_selectors --- -
{{CSSRef}}
+{{CSSRef}} -

CSS の全称セレクター (universal selector) (*) は、すべての種類の要素にマッチします。

+CSS の**全称セレクター** (universal selector) (`*`) は、すべての種類の要素に一致します。 -
/* すべての要素を選択 */
+```css
+/* すべての要素を選択 */
 * {
   color: green;
-}
+} +``` -

CSS3 から、アスタリスクは{{cssxref("CSS_Namespaces", "名前空間")}}と組み合わせて使用できるようになりました。

+全称セレクターは {{CSSXref("@namespace")}} を使用して名前空間を付けることができます。これは、複数の名前空間を含む文書、例えば HTML5 とインライン SVG または MathML、または複数の語彙が混在した XML などを扱うのに有用です。 - +- `ns|*` - 名前空間 _ns_ の中ですべての要素に一致します +- `*|*` - すべての要素に一致します +- `|*` - 名前空間が宣言されていないすべての要素に一致します -

構文

+## 構文 -
* { スタイルプロパティ }
+```css +* { スタイルプロパティ } +``` -

アスタリスクは単純セレクターを伴う場合に省略可能です。たとえば、 *.warning と .warning は等価です。

+アスタリスクは単純セレクターを伴う場合に省略可能です。たとえば、 `*.warning` と `.warning` は等価です。 -

例

+## 例 -

CSS

+### CSS -
* [lang^=en] {
+```css
+* [lang^=en] {
   color: green;
 }
 
@@ -51,54 +54,45 @@ translation_of: Web/CSS/Universal_selectors
   float: left
 }
 
-/* フロート要素の後の兄弟要素で自動的にフロートをクリアする */
+/* 浮動要素の後の兄弟要素で自動的に浮動を解除する */
 .floating + * {
   clear: left;
 }
-
- -

HTML

- -
<p class="warning">
-  <span lang="en-us">A green span</span> in a red paragraph.
-</p>
-<p id="maincontent" lang="en-gb">
-  <span class="warning">A red span</span> in a green paragraph.
-</p>
- -

結果

- -

{{EmbedLiveSample('Examples')}}

- -

仕様書

- - - - - - - - - - - - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName('CSS4 Selectors', '#the-universal-selector', 'universal selector')}}{{Spec2('CSS4 Selectors')}}変更なし
{{SpecName('CSS3 Selectors', '#universal-selector', 'universal selector')}}{{Spec2('CSS3 Selectors')}}名前空間に関する振る舞いを定義し、疑似要素の中でセレクターを省略できる旨を明記
{{SpecName('CSS2.1', 'selector.html#universal-selector', 'universal selector')}}{{Spec2('CSS2.1')}}初回定義
- -

ブラウザーの対応

- -

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

+``` + +### HTML + +```html +

+ A green span in a red paragraph. +

+

+ A red span in a green paragraph. +

+``` + +### 結果 + +{{EmbedLiveSample('Examples')}} + +### 名前空間 + +この例では、セレクターは example 名前空間内の要素にのみ一致します。 + +```css +@namespace example url(http://www.example.com); +example|* { color: blue } +``` + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [CSS セレクター](/ja/docs/Web/CSS/CSS_Selectors) +- [CSS の学習: セレクター](/ja/docs/Learn/CSS/Building_blocks/Selectors) -- cgit v1.2.3-54-g00ecf