※有料会員になるとこの動画をご利用いただけます
詳しい説明を読む
＃01:メディアクエリ
このチャプターでは、メディアクエリについて学習します。
メディアクエリは、出力デバイスの特性や種類を判別して、条件を満たす場合にだけCSSの設定を適用するための記述です。
メディアクエリを用いるときは、@mediaで指定した後に、条件を特性名と値のセットという形で記述します。
メディアクエリで指定する特性にはさまざまな種類があり、主な特性として、
・ビューポートの横幅を判別するmin-width、max-width、width
・ビューポートの高さを判別するmin-height、max-height、height
・ビューポートの向きを判別するorientation
・解像度を判別するmin-resolution、max-resolution、resolution
があります。
MDN web docs
https://developer.mozilla.org/ja/docs/Learn_web_development/Core/CSS_layout/Media_queries
https://developer.mozilla.org/ja/docs/Web/CSS/CSS_media_queries/Using_media_queries
https://developer.mozilla.org/ja/docs/Web/CSS/@media