Ios CSS媒体查询头痛

正如我之前所说：*业余警告**

我对iphone的媒体查询有问题（纵向）

以下是我的疑问：

对于大型监视器

@media only screen and (min-width: 1024px) and (min-height: 861px)

对于不太大的显示器

@media only screen and (min-width:1024px) and (max-height:860px)

适用于iPad和窗口较小时

@media only screen and (min-width:760px) and (max-width:1023px), screen and (min-device-width: 768px) and (max-device-width: 1024px)

适用于iPhone（3及以上）

我的iphone（横向）触发ipad和小窗口查询。。。有什么建议吗

我希望iphone在横向上触发“ipad”css，但在纵向上触发iphone css

---

最后一点，当我在mac上缩小浏览器窗口时，它显示得很好（它应该显示），问题是iphone-我已经在iphone 5和3S上试过了使用以下代码进行iphone 5媒体查询：

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 

如果要支持纵向，请执行以下操作：

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : portrait)

screen  and (max-device-width : 568px) and (orientation:portrait)

至于景观：

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : landscape)

---

尝试以下方法，这对我很有用：

1-将此标记添加到html标头：

<meta name="viewport" content="width=device-width, initial-scale=1.0">

3-为iPad和iPhone环境添加此媒体查询：

@media screen and (max-width: 800px) {}

---

神奇的数字是568px——这是一个临界点，似乎iphone有其最大设备宽度，无论您使用的是iphone 3

所以发生的是我的阈值是768

以下是我对iphone肖像的最后查询：

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : portrait)

screen  and (max-device-width : 568px) and (orientation:portrait)

对于其余部分，我在前面的这些参数中显示了：

screen  and (min-device-width : 569px), (max-device-width : 568px) and (orientation:landscape)

---

你看过这个吗？如果你的意思是stackoverflow，是的，非常…让我比我第一次评论的超链接更清楚。哈是的。。。有时显性帮助。。。是的，正如在那个网站上建议的那样，我用我的ipad和iphone查询替换了我的iphone媒体查询并轻推，但仍然没有运气-我想知道的是为什么我的ipad查询会在我的iphone上触发-为什么我的参数在你的iphone查询中出错，我注意到您在

@media

和

屏幕之间缺少一个
关键字。你在实际代码中检查过了吗？