CSS セレクタクイズ

1 第1問

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

A #all

B .any

C *

D element

2 第2問

`id="main-content"`を持つ要素を正確に選択するCSSセレクタはどれですか？

A .main-content

B main-content

C #main-content

D *main-content

3 第3問

`class="highlight"`が適用されているすべての要素を選択するCSSセレクタはどれですか？

A highlight

B #highlight

C .highlight

D *highlight

4 第4問

次のCSSセレクタ `div p` は、どのような要素を選択しますか？

A `div`要素の直下にある`p`要素

B `div`要素の直後にある`p`要素

C `div`要素の子孫であるすべての`p`要素

D `div`要素と`p`要素の両方

5 第5問

次のCSSセレクタ `ul > li` は、どのような要素を選択しますか？

A `ul`要素の子孫であるすべての`li`要素

B `ul`要素の直下にある`li`要素

C `ul`要素の直後にある`li`要素

D `ul`要素と`li`要素の両方

6 第6問

次のCSSセレクタ `h2 + p` は、どのような要素を選択しますか？

A `h2`要素の直下にある`p`要素

B `h2`要素の直後にある最初の`p`要素

C `h2`要素の後に続くすべての`p`要素

D `h2`要素と`p`要素の両方

7 第7問

マウスカーソルが要素の上に乗ったときにスタイルを適用するための擬似クラスはどれですか？

A ::hover

B :active

C :focus

D :hover

8 第8問

次のCSSセレクタの中で、最も高い詳細度（Specificity）を持つものはどれですか？

A p

B .my-class

C #my-id

D div p

9 第9問

特定の属性を持つ要素を選択するためのCSSセレクタはどれか？例えば、`input`要素のうち、`type="text"`を持つものを選択したい場合。

A `input.type="text"`

B `input[type="text"]`

C `input#type="text"`

D `input:type="text"`

10 第10問

マウスカーソルが要素の上に乗ったときにスタイルを適用するための擬似クラスはどれか？

A `::before`

B `::after`

C `::hover`

D `:hover`

CSS セレクタ クイズ