2

ユーザーのデバイスが非網膜か網膜かによって、異なるスタイルシートを設定する方法を探していました。たくさんの異なる方法に出くわしたので、今ではどれを行うべきかわかりません。私の意見では、これはより簡単で効率的なもののようです：

<link rel="stylesheet" href="myCss.css" media="screen and min-device-pixel-ratio: 2">

しかし、それが最新の構文であるかどうかはわかりません。これは最新のすべてのブラウザー (ie9 を含む) で機能しますか?この方法を改善する方法はありますか?

4

2 に答える 2

2

既存のスタイルシートで

@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
    /* Retina-specific stuff here */
}

から

CSS トリック

于 2012-12-19T15:49:04.680 に答える
0

mediaタグ内の属性を使用したアプローチlinkは、良い出発点です。media query内で直接使用できるnew を使用することをお勧めしますが.css。

http://www.w3.org/TR/css3-mediaqueries/

次のように実行できます。

@media only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2){
    /* The retina stuff here */
    }

さらに読む: http://menacingcloud.com/?c=highPixelDensityDisplays

于 2012-12-19T15:51:17.273 に答える