CSS セレクタクイズ

1 第1問

全てのHTML要素にスタイルを適用するセレクタはどれですか？

A #all

B .all

C element

D *

2 第2問

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

A div > p

B div + p

C div ~ p

D div p

3 第3問

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

A ul li

B ul + li

C ul ~ li

D ul > li

4 第4問

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

A h1 p

B h1 > p

C h1 ~ p

D h1 + p

5 第5問

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

A h2 p

B h2 > p

C h2 + p

D h2 ~ p

6 第6問

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

A ::hover

B :active

C :focus

D :hover

7 第7問

`data-type`属性が正確に`"button"`である要素を選択するセレクタはどれですか？

A [data-type^="button"]

B [data-type*="button"]

C [data-type~="button"]

D [data-type="button"]

8 第8問

特定のHTML要素に設定された属性の値が、「https://」で始まるもの全てを選択するCSSセレクタはどれですか？（例: <a href="https://example.com">）

A a[href="https://"]

B a[href^="https://"]

C a[href*="https://"]

D a[href~="https://"]

9 第9問

親要素内の子要素のうち、3番目、6番目、9番目…といった具合に、3の倍数の順番にある要素だけを選択するCSSセレクタはどれですか？

A :nth-child(3)

B :nth-child(3n)

C :nth-child(3n+1)

D :nth-child(odd)

10 第10問

次のHTML構造で、`<h2>`タグの後に続くすべての`<p>`タグを選択するCSSセレクタはどれですか？ ```html <div> <h1>タイトル</h1> <p>最初の段落</p> <h2>セクション見出し</h2> <p>セクション後の段落1</p> <p>セクション後の段落2</n> <div>別の要素</div> <p>セクション後の段落3</p> </div> ```

A h2 + p