CSS セレクタクイズ

1 第1問

`p`セレクタは何を選択しますか？

A `id="p"`を持つ要素

B `class="p"`を持つ要素

C すべての`<p>`要素

D 親要素が`<p>`である要素

2 第2問

`id="header"`を持つ要素を選択するCSSセレクタはどれですか？

A `.header`

B `#header`

C `header`

D `*header`

3 第3問

すべてのHTML要素を選択するCSSセレクタはどれですか？

A `html`

B `body`

C `*`

D `all`

4 第4問

`div`要素の子孫であるすべての`p`要素を選択するCSSセレクタはどれですか？

A `div > p`

B `div + p`

C `div ~ p`

D `div p`

5 第5問

`ul`要素の直接の子であるすべての`li`要素を選択するCSSセレクタはどれですか？

A `ul li`

B `ul > li`

C `ul + li`

D `ul ~ li`

6 第6問

`h1`要素の直後に続く`p`要素を選択するCSSセレクタはどれですか？

A `h1 p`

B `h1 > p`

C `h1 + p`

D `h1 ~ p`

7 第7問

`h2`要素と同じ親を持ち、`h2`要素の後に続くすべての`p`要素を選択するCSSセレクタはどれですか？

A `h2 p`

B `h2 > p`

C `h2 + p`

D `h2 ~ p`

8 第8問

`data-type`属性を持つすべての要素を選択するCSSセレクタはどれですか？

A `[data-type]`

B `.data-type`

C `#data-type`

D `data-type`

9 第9問

マウスカーソルが上に乗っている（ホバー状態の）リンク要素を選択するCSSセレクタはどれですか？

A `a:active`

B `a:focus`

C `a:hover`

D `a:visited`

10 第10問

ウェブページ上で、`href`属性の値に「blog」という文字列を含むすべての`<a>`要素を選択するCSSセレクタはどれですか？

A a[href="blog"]

B a[href^="blog"]

C a[href$="blog"]

D a[href*="blog"]

CSS セレクタ クイズ