我无法以横向方式获取iPhone 6+的媒体查询以正常运行。肖像工作得很好。
我在iPhone 5上使用@media only screen and (min-width:320px) and (max-width:568px) and (orientation: landscape) {}
,在iPhone 6+上使用@media only screen and (min-width:414px) and (max-width:736px) and (orientation: landscape) {}
- 但后来iPhone 5改为我为iPhone 6+编写的内容。在我将736px
宽度更改为800px
宽度之前,iPhone 6+不会改变。
我已经尝试了很多不同的东西,这里发现堆栈溢出但没有任何作用。由于某些原因,min / max-DEVICE-width对我不起作用。
我正在使用针对谷歌浏览器的响应式网页设计测试程序进行测试(我还没有使用iPhone 6+进行测试)。
我的<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
代码中有<head>
。
请帮忙!
答案 0 :(得分:0)
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/