下位セレクタ(子孫セレクタ)。

CSSでのセレクタ(選択子)の一つである、下位セレクタ(子孫セレクタ)に関して解説します。

下位セレクタ(子孫セレクタ)とは。

下位セレクタ(子孫セレクタ)とは、ある上位要素の下位にある要素を対象とするセレクタです。

尚、下位にある要素が直下でなくても構いません

下位セレクタ(子孫セレクタ)の書式。

下位セレクタ(子孫セレクタ)の書式は、

上位セレクタ 下位要素セレクタ

と、空白文字で区切ります。

このとき、上位セレクタ、下位要素セレクタとも任意のセレクタが使えます。

  • 下位セレクタ自身も上位セレクタなり下位要素セレクタなりに使えます。従って、三段階以上の子孫関係を持つ下位セレクタも当然出来ます。

下位セレクタ(子孫セレクタ)の記述例。

例えば、<h1>要素の下位にある<a>要素にスタイルを適用する場合は、

h1 a {}

と記述します。


しらぎくのウェブサイト作成入門サイトマップ