画像AA画像BB画像CC

メディア・クエリーの実験 "Big Size"
横幅 800px から, 大きなサイズ

メディア・クエリーの実験 "Medium Size"
横幅 500px 〜 799px の範囲内

メディア・クエリーの実験 "small Size"
横幅 499px 以下のサイズ

セクション-その 1

Media Query (メディア・クエリー) とは CSS の一部で, 特定の条件 (スクリーン・サイズ / デバイス・タイプ など)に基づいてページのレイアウトを調節するための機能です.
これにより, デバイスの画面サイズや解像度に応じて異なる CSS (スマートフォン / タブレット / デスクトップPCなどのレイアウト)を提供することができます.
Media Query は レスポンシブ・デザイン に必須の条件ということです.


セクション-その 2


セクション-その 3