具有設備像素比率/分辨率的媒體查詢：語法不正確？

Question

我正在使用iOS模擬器爲各種iOS設備測試我的響應主題的媒體查詢，但下面的媒體查詢未呈現。我已經引用了w3.org媒體查詢標準，加上來自A List Apart的this blog post,A Pixel Identity Crisis，以及其他一些Mozilla's blog post，但是沒有看到有什麼突破查詢，是嗎？

/*-- iPhone 4, 4S Retina -----------------------*/ 

@media 
screen and (min-pixel-ratio:2) and (min-width:320px) and (max-width:600px), 
screen and (-webkit-min-pixel-ratio:2) and (min-width:320px) and (max-width:600px), 
screen and (-o-min-pixel-ratio:2/1) and (min-width:320px) and (max-width:600px), 
screen and (min--moz-pixel-ratio:2) and (min-width:320px) and (max-width:600px),/* Firefox browsers prior to FF 16) */ 
screen and (min-resolution:2ddpx) and (min-width:320px) and (max-width:600px) { 
    /*styles here */ 
} 


/*------- iPhone 2G, 3G, 3GS -------------*/ 
@media 
screen and (max-device-pixel-ratio: 1.5) and (min-width: 320px) and (max-width: 600px), 
screen and (-webkit-max-device-pixel-ratio: 1.5) and (min-width: 320px) and (max-width: 600px), 
screen and (-o-max-device-pixel-ratio: 1/5) and (min-width: 320px) and (max-width: 600px), 
screen and (max--moz-device-pixel-ratio: 1.5) and (min-width: 320px) and (max-width: 600px), /* Firefox browsers prior to FF 16) */ 
screen and (max-resolution: 1.5ddpx) and (min-width: 320px) and (max-width: 600px) { 
    /*styles here*/ 
} 

Answer 1

如果只針對IOS（你不必擔心歌劇/火狐），那麼你可以放心地縮短您的媒體查詢是這樣的：

/*-- iPhone 4, 4S Retina -----------------------*/ 
@media screen and (-webkit-min-pixel-ratio:2) and (min-width:320px) and (max-width:600px) { 
    /*styles here */ 
} 

/*------- iPhone 2G, 3G, 3GS -------------*/ 
@media screen and (min-width: 320px) and (max-width: 600px){ 
    /*styles here*/ 
} 

它也可能是一個如果您的網站需要它們，也可以在這裏設置(orientation: landscape)/(orientation: portrait)。