0

@importretina 固有のスタイル用に retina.css を取り込む main.css ファイルの先頭にあります。

Retina デバイスでのみ@importretina.css ファイルを表示するために追加できるメディア クエリはありますか? retina.css をすべてのページ/すべてのデバイスにロードしたくありません。また、Retina スタイルを別のファイルに保持したいと考えています。

@import "retina-styles.css";

/*** other styles below ***/

<link rel="stylesheet" href="retina.css" media="only screen and (-webkit-min-device-pixel-ratio: 2)" />開発者が を使用し<head>たいので、では使用できません@import。

4

2 に答える 2

1

MDN "@import"によると、@importステートメントでメディアクエリを使用することができます。

@import url;
@import url list-of-media-queries;

したがって、これは機能するはずです（テストされていません）：

@import url(retina.css) screen and (-webkit-min-device-pixel-ratio: 2);

-webkit-min-device-pixel-ratio-propertyの詳細については、AppleのSafari開発者ライブラリ「サポートされているCSSルール」を参照してください。

于 2012-08-15T21:38:38.957 に答える
-1

min-device-pixel-ratio を使用してすべての Retina スタイルをメディア クエリにラップし、ファイルを下部の既存の css に @import するだけです。または、スタイルをメインの css に含めて、同じメディア クエリをラップします。

于 2012-08-14T22:10:40.900 に答える