1. ホーム
  2. html

[解決済み] CSS Media QueryのIE8対応

2022-02-25 11:07:21

質問

IE8は、以下のCSSメディアクエリに対応していないのでしょうか。

@import url("desktop.css") screen and (min-width: 768px);

そうでない場合、代替となる書き方を教えてください。 Firefoxでも同様に問題なく動作します。

以下のコードに何か問題がありますか?

@import url("desktop.css") screen; 
@import url("ipad.css") only screen and (device-width:768px);

解決方法は?

IE9以前のInternet Explorerのバージョン はメディアクエリをサポートしていません。 .

の方法を探しているのであれば デグレード IE8 のユーザーのためのデザインは、IEの条件付きコメントが役に立つかもしれません。これを使うと、IE 8/7/6 固有のスタイルシートを指定して、以前のルールを上書きすることができます。

例えば

<link rel="stylesheet" type="text/css" media="all" href="style.css"/>
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" media="all" href="style-ie.css"/>
<![endif]-->

これはIE8でのレスポンシブデザインを可能にしませんが、JSプラグインを使用するよりもシンプルでアクセスしやすい解決策になるかもしれません。