Q

HiDPIとは何ですか？そのようなデバイスに必要な個別のメディアクエリとスプライトがあるのはなぜですか？

2016-03-20 20 views 1 likes

1

私はちょうどicheck.jsのソースを経たとCSSで私は、次のルールが定義された：通常のデバイスの場合HiDPIとは何ですか？そのようなデバイスに必要な個別のメディアクエリとスプライトがあるのはなぜですか？

/* HiDPI support */ 
@media (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi), (min-resolution: 1.25dppx) { 
    .icheckbox_flat-green, 
    .iradio_flat-green { 
     background-image: url([email protected]); 
     -webkit-background-size: 176px 22px; 
     background-size: 176px 22px; 
    } 
}

作成した精神は以下の通りです：

そして、上記のメディアクエリのデバイスの場合、作成されるスプライトは以下のものです：

これは非常に大きなサイズですが、誰かがこのメディアクエリの使い方を説明することができます。なぜこの余分なスプライトが必要ですか？

私が話しているプラグインは、もちろんTHISです。

なぜ、別のメディアクエリとスプライトですか？

ありがとうございます。

2016-03-20 Alexander Solonik

A

答えて

1

高いDPIのスクリーン（Apple Retina Displayとして販売されているものなど）は、より多くのピクセルを同じ物理量にパックします。これにより、より鮮明なテキストと画像が可能になります。

これらを利用するには、より多くのピクセルを持つ画像を供給する必要があります。

2016-03-20 13:51:47 Quentin

+0

ありがとう、素晴らしい理論的な答えですが、例を挙げることができますか？ –

+2

@AlexanderSolonik - しました。 Apple Retina Display。 – Quentin

1

HDPIは、歪みのないレンダリングのために高画質解像度デバイスをターゲットにするために使用されます。

は、この情報がお役に立てば幸い！

2016-03-20 13:57:24 Dev

関連する問題