CSS
メディアクエリ
読み方：メディアクエリ
@media を使って画面幅に応じてCSSを切り替える仕組み。
やさしい説明
メディアクエリとは、画面サイズに応じてCSSを切り替える仕組みです。
@media (条件) { スタイル } の形で書きます。レスポンシブデザインの核となる技術です。
具体例・使い方
@media (max-width: 768px) → 768px以下で適用
@media (min-width: 1024px) → 1024px以上で適用
よくある疑問
Q: ブレークポイントはいくつ設定すべき？
A: 一般的には768px（タブレット）と1024px（デスクトップ）の2つで十分です。
関連用語
📖 関連レッスン
レッスンを見る →