iPhone 4陷阱最大寬度：480個像素媒體查詢

Question

的iPhone 4採用的640×960分辨率落入內指定的媒體的查詢：

@media only screen and (max-width:480px) 

此媒體查詢是在非常端我的CSS樣式表...

以上這個查詢是指那些爲iPad（1024）和桌面等偉大的工作......

我是什麼失蹤？？

我想iPhone4的對先前在樣式表中指定媒體查詢，針對性的迴應：（最大寬度：640像素）代替，當然...

爲了記錄在案，我視標籤當前是：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 

Answer 1

您已經混淆了css px和display px。這是可以理解的，因爲它們都是以px來衡量的。嘆。

從css的角度來看，視網膜顯示器只有320px寬。但是，它的像素比是2，這意味着在css-land中每1px在顯示器上實際上是2px。

Taken from here，你可以使用不同的選擇，以確定視網膜顯示：

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