iPhone 6媒体查询

Question

我无法横向获取iPhone 6+的媒体查询，以使其正常运行。 人像工作正常。 我正在使用@media only screen and (min-width:320px) and (max-width:568px) and (orientation: landscape) {}用于iPhone 5和@media only screen and (min-width:414px) and (max-width:736px) and (orientation: landscape) {}适用于iPhone 6+），但随后iPhone 5更改为我为iPhone 6+编写的内容。 而且直到我将736px宽度更改为800px宽度时，iPhone 6+才会更改。

我已经尝试过在堆栈溢出中找到很多不同的东西，但是没有任何效果。 由于某种原因，最小/最大设备宽度对我不起作用。

我正在使用适用于Google Chrome的自适应Web设计测试器进行测试（我没有要测试的iPhone 6+）。 我的<head>标记中有<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> 。

请帮忙！

Answer 1

iPhone 6的媒体查询

/* ----------- iPhone 6 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 

}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 

}

在这里您可以找到有关它的出色教程https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

iPhone 6媒体查询

问题描述

1 个解决方案

解决方案1
0 2016-11-02 12:10:36

iPhone 6媒体查询

问题描述

1 个解决方案

解决方案1 0 2016-11-02 12:10:36

解决方案1
0 2016-11-02 12:10:36