媒体查询仅被某些手机匹配

Question

此媒体查询仅被 iPhone 6 Plus 拾取，但未被任何其他 iPhone 或 Android phone.

拾取

@media screen and (device-aspect-ratio: 16/9) and (max-width:768px), 
screen and (device-aspect-ratio: 16/10) and (max-width:768px){
    .content{
         margin-top:200vh
    }
}

有什么想法吗？

谢谢，

亚伦

Answer 1

使用方向会不会比 device-aspect-ratio 更好，例如。

@media screen and (orientation: landscape) and (max-width:768px){
    .content{
         margin-top:200vh
    }
}

Plus device-aspect-ratio 将被弃用并替换为 aspect-ratio http://dev.w3.org/csswg/mediaqueries-4/

Answer 2

大概是纵横比吧。如果另一个屏幕具有相同的宽度但不同的纵横比（即高度），那么它将不匹配并且不会为该设备呈现。尽量不要在您的@media 查询中过于具体 - 定位精确的设备会给您带来很多工作，尝试让布局在设备之间流动，它不需要在每个设备上进行精确的像素定位。除了下个月，一波全新的设备将投放市场，并抵消所有的辛勤工作。

媒体查询仅被某些手机匹配

Media query only been matched by certain phones

css

iphone

android

media-queries