全称セレクタ

通用セレクター

記述

通用セレクター (*) は、ドキュメントツリー内のすべての要素にマッチします。

通用セレクターは通常、他のセレクターと組み合わせて使用し、ページ上のすべての要素にスタイルを適用します。
通用セレクターは広範囲に影響するため、注意して使用する必要があります。ページ上のすべての要素に影響を与える可能性があり、予期しないスタイルの問題が発生する可能性があります。
より具体的なセレクターを使用すると、ブラウザーがチェックする要素の数が減るため、パフォーマンスが向上します。


<style>
  * {
    margin: 0;
    padding: 0;
  }
</style>

<p>この段落はマージンとパディングが0に設定されています。</p>
<h2>この見出しもマージンとパディングが0に設定されています。</h2>


<style>
  div * {
    color: blue;
  }
</style>

<div>
  <p>この段落は青色です。</p>
  <span>このスパンも青色です。</span>
</div>

質問	回答
通用セレクターを使用する際に注意すべき点は？	通用セレクターは、ページ上のすべての要素に影響を与えるため、注意して使用する必要があります。予期しないスタイルの問題が発生する可能性があるため、より具体的なセレクターを使用することが推奨されます。また、パフォーマンスへの影響も考慮する必要があります。
通用セレクターと他のセレクターを組み合わせることはできますか？	はい、属性セレクター、疑似クラスセレクターなどと組み合わせて、より柔軟な選択が可能です。例えば、「div *」はdiv要素内のすべての要素を選択します。
CSSリセットスタイルシートで通用セレクターがよく使われるのはなぜですか？	ブラウザは、要素ごとにデフォルトのスタイルを持っています。CSSリセットスタイルシートは、これらのデフォルトスタイルをリセットし、すべての要素に共通のスタイルを適用するために使用されます。通用セレクターは、すべての要素を選択するのに便利なので、この目的によく使用されます。