全称セレクター

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

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

css
/* すべての要素を選択 */
* {
  color: green;
}

全称セレクターは @namespace を使用して名前空間を付けることができます。これは、複数の名前空間を含む文書、例えば HTML5 とインライン SVG または MathML、または複数の語彙が混在した XML などを扱うのに有用です。

  • ns|* - 名前空間 ns の中ですべての要素に一致します
  • *|* - すべての要素に一致します
  • |* - 名前空間が宣言されていないすべての要素に一致します

構文

css
* { スタイルプロパティ }

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

CSS

css
* [lang^="en"] {
  color: green;
}

*.warning {
  color: red;
}

*#maincontent {
  border: 1px solid blue;
}

.floating {
  float: left;
}

/* 浮動要素の後の兄弟要素で自動的に浮動を解除する */
.floating + * {
  clear: left;
}

HTML

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>

結果

名前空間

この例では、セレクターは example 名前空間内の要素にのみ一致します。

css
@namespace example url(http://www.example.com);
example|* {
  color: blue;
}

仕様書

Specification
Selectors Level 4
# the-universal-selector

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Universal selector (*)
Namespaces (*|*)

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

関連情報