@media查询不会在横向模式下触发iPhone 6 plus

Question

我一直在基于iPhone 6型号的标准媒体查询的一个非常受欢迎的答案使用以下查询，但是，横向模式不会被使用。 更令人困惑的是，为纵向媒体查询编写的css在横向模式下仍处于活动状态。

@media only screen 
  and (min-device-width : 414px) 
  and (max-device-width : 736px) 
  and (orientation : landscape) 
  and (-webkit-min-device-pixel-ratio : 3) 
{ }

@media only screen 
  and (min-device-width : 414px) 
  and (max-device-width : 736px) 
  and (orientation : portrait) 
  and (-webkit-min-device-pixel-ratio : 3) 
{ }

其他人是否遇到过相同的问题和/或知道解决方法？

Answer 1

@media only

在技​​术上已弃用（ http://dev.w3.org/csswg/mediaqueries-4/ ），则不需要“仅”，因此可能是问题的一部分。

但是，在没有定位至少1000px的情况下，我在iPhone 6上通常无法通过@media获得成功。

他们的缩放方法似乎以约2k的分辨率将图像发送到Safari移动浏览器，然后本地设备图像缩放处理缩放。

似乎需要一种新方法，或者至少需要更多特定于设备的方法。