ユニバーサルセレクタ(全称セレクタ)
全てのHTML要素に対して、共通のスタイルを一括で指定する場合には、「ユニバーサルセレクタ(全称セレクタ)」というものを使用します。ブラウザに実装されているCSSのデフォルト設定は、それぞれ若干異なっている事があり、思わぬ所で不具合が生じる可能性があります。それを回避するためには、全称セレクタを使って一度全ての要素のデフォルト値を統一してから、必要に応じて各要素に改めてスタイルを指定していく必要があります。そのような場合に重宝するセレクタです。
ユニバーサルセレクタの指定方法
「ユニバーサルセレクタ(全称セレクタ)」は、ワイルドカード的な役割を果たす便利な記号です。記述は非常に簡単で記号一文字で表します。
*
このコメ印のような記号を「アスタリスク」と呼びます。このセレクタを使うと、同じ指定を全ての要素に一括で指定することができます。これでわざわざ要素ごとに同じ指定をしなくても済むというわけです。
画面全体にスタイルを指定する[body]と[*]は何処が違うの?という質問を見かけますが、[body]の場合は、子要素に対して継承することになっている値しか反映されません。そのため、無条件に全ての要素に対して同じスタイルを指定をしたい場合には[*]を使用します。
ユニバーサルセレクタの記述例
ここで全称セレクタでブラウザのデフォルト値をリセットするために、よく使われるプロパティのサンプルを記述してみましょう。コピーして自分のサイトに最適になるように、色々試してみて下さい。
CSS
* { font-size: 100%; font-weight: normal; font-style: normal; text-decoration: none; background: transparent; padding: 0px; margin: 0px; }
CSSリファレンス
CSSって何? | 初めての方はこちらからお読み下さい |
CSSの書き方 | CSSの書き方について基本的な解説です |
CSSの特徴 | CSSの特徴を理解して有効に活用しましょう |
CSSで使えるセレクタ | セレクタとはスタイルを適用する対象を指定するものです |
CSSで使える単位 | CSSで使える単位の一覧です |
ブロックレベルとインライン | ブロックレベル要素とインライン要素について詳しく解説 |
idとclassについて | 要素にidとclassで名前を付ける |
余白と外枠の関係 | 余白や外枠を指定する際のコツについて |
DOCTYPE宣言・DOCTYPEスイッチ | [!DOCTYPE]の使い方について |
ユニバーサルセレクタ(*)について | ユニバーサルセレクタ(全称セレクタ)を使えば全てのタグを一括で指定できます |