メディアクエリー

メディアクエリーとは

メディアクエリーは、画面の幅、向き、解像度、入力方法、印刷など、表示環境が指定した条件に一致するときだけCSSを適用する仕組みです。

どんな場面で使うか

スマートフォンとパソコンでレイアウトを変える、横向き画面へ対応する、印刷時に不要な要素を隠す、動きを減らす設定へ配慮するといった場面で使います。

選ぶとき・使うときのポイント

端末名ごとに条件を増やすのではなく、内容が読みづらくなる地点を基準に条件を決めます。条件の重なりや優先順位を複雑にしすぎず、条件外でも基本機能が使える状態を保ちます。