エキスパート：実技問題（HTML作成、CSS読込と作成、画像の表示、JavaScriptの読込、レスポンシブWebデザイン対応）
レスポンシブWebデザインのCSSに、次の2つのメディアクエリをこの順序で記述した。「@media (min-width: 600px) { .box { color: blue; } }」「@media (min-width: 900px) { .box { color: red; } }」画面幅1200pxのブラウザで閲覧した場合、.box要素の文字色として正しいものはどれか。
- A青
- ✓赤
- C両方のスタイルが適用され黒になる
- Dどちらのスタイルも適用されない
解説
画面幅1200pxは600px以上・900px以上の両条件を満たすため両方のルールが有効となるが、CSSのカスケード規則により後に記述されたルールが優先されるため、後で書かれたredが適用される。
根拠出題範囲：実技問題「CSSの読込と作成」「レスポンシブWebデザイン対応」