メディア クエリの適用と css3_html/css_WEB-ITnose の変更

CSS はメディアに関連付けられたスタイル シートの設定を常にサポートしてきました。さまざまなメディア タイプを表示するように調整できます。たとえば、ドキュメントは画面に表示されるときはサンセリフ フォントを使用し、印刷されるときはセリフ フォントを使用します。画面と印刷は 2 つの事前定義されたメディア タイプです。

HTML4ではメディアスタイルシートの書き方は

CSS3ではメディアクエリはメディアタイプの機能を拡張したもので、今のところメディアクエリはメディアタイプといくつかの式で構成されています。式は、特定のメディア プロパティの条件を確認する役割を果たします。メディア クエリを使用すると、Web ページのコンテンツを変更することなく、ドキュメントの表示を特定の出力デバイスに適応させることができます。メディア クエリは、true または false に評価される論理式です。メディア クエリのメディア タイプがユーザー クライアントが配置されているデバイスのメディア タイプと一致し、メディア クエリのすべての式が true の場合、true を返します。 。

メディア クエリの例をいくつか示します。

すべてのメディア タイプに適用される短縮構文があり、キーワード all とそれに続く and は省略できます。

デザイナーと開発者は、このメソッドを使用して特別なニーズを満たす複雑なクエリを作成できます。

メディア クエリには次のような多くの機能があります。 - 高さ;

アスペクト比とデバイスのアスペクト比;

モノクロ (モノクロデバイスでない場合は 0 に等しい);

グリッド (出力デバイスがラスターかビットマップかを参照)。