आईओएस और एंड्रॉइड पर -वेबिट-डिवाइस-पिक्सेल-अनुपात का सही तरीके से उपयोग कैसे करें?

Question

-webkit-device-pixel-ratio क्वेरी आईओएस और एंड्रॉइड दोनों द्वारा समर्थित है, लेकिन चूंकि आईओएस target-densitydpi=device-dpi का समर्थन नहीं करता है, इससे अलग-अलग परिणाम मिलते हैं। उदाहरण के लिए:

@media screen and (-webkit-device-pixel-ratio: 2) { 
    body { font-size: 2em; } 
} 

गैलेक्सी नेक्सस पर फ़ॉन्ट को अच्छा लगेगा, लेकिन आईफोन 4 पर यह बहुत बड़ा होगा।

क्या जावास्क्रिप्ट के बिना आईओएस पर target-densitydpi=device-dpi अनुकरण करने या आईओएस पर -webkit-device-pixel-ratio अक्षम करने और अपने उपयोगकर्ताओं को धुंधली छवियों के साथ फॉलबैक के रूप में छोड़ने का कोई तरीका है?

Answer 1

@media (-webkit-min-device-pixel-ratio: 2), /* Retina on Webkit */ 
     (min-resolution: 192dpi)    /* Everyone else */ { 
... 
} 

इस महान लेख से

मैं संयोग से पढ़ आज: http://www.w3.org/blog/CSS/2012/06/14/unprefix-webkit-device-pixel-ratio/