css - iPad 与 iPad Air 的媒体查询

Question

StackOverflow 上已经有 2 个关于 @media 查询的良好讨论。其中之一在这里:CSS media queries work for iPad2, iPad Air, Samsung Galaxy, large screens but not the usual desktop screens .

这些讨论发生在 iPad Air 出现之前。 iPad Air 的视口(viewport)为 2048 x 1536。我找不到它的 webkit-min-device-pixel-ratio。我想专门针对 Air，因为我的 AJAX 网站缩小到它的一半大小。本网站仅供横向使用。

所以...

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
(-webkit-min-device-pixel-ratio: 1.0)

-> 针对旧的 iPad 2

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
(-webkit-min-device-pixel-ratio: 2.0)

-> 针对 iPad 3 和 4 的视网膜，但不针对 Air

我已经尝试过

@media only screen 
and (min-device-width : 1536px) 
and (max-device-width : 2048px) 
and (-webkit-min-device-pixel-ratio: 2.0)

尝试让空气使用react。谁有开发新 Air 的经验？

Answer 1

您需要视口(viewport)大小 http://viewportsizes.com/?filter=ipad Air 也有 1024x768 视口(viewport)