【发布时间】：2015-09-04 04:58:04
【问题描述】：
我想排除 iPad 将我的 CSS 样式用于我网站上的桌面视图。我首先构建了我的网站，因此桌面样式位于媒体查询中。
在弄乱我的代码时，我尝试了这个：
/*mobile and default styles (the styles I want the iPads to use)*/
@media (min-width: 750px;),
@media (device-width: 768px) and (device-height: 1024px) /*iPad resolution*/ {
/*desktop styles (the styles I don't want the iPad to use)*/
/*in this code, these styles are currently being ignored by iPads*/
}
我认为这不是有效的代码，但它在我测试过的所有浏览器和设备中都能正常工作。
这与在一个媒体查询中有两条@media 行有关。第二组参数以某种方式从查询中排除，但我不明白为什么。如果没有第二个@media，那么它就像or 运算符一样工作，桌面样式将显示在iPad 上。
我尝试过嵌套媒体查询，但这似乎不起作用，我尝试使用not，但第一行仍然是正确的，因此它也可以工作。
我没有找到任何关于在声明中使用@media 两次 并让它以某种方式排除第二个媒体查询的任何信息，有人可以解释这样做的正确方法，或者至少解释一下为什么会这样？
【问题讨论】：
-
iPad 似乎不是完全最新的，只是以不同的方式解析我的 CSS，因此这只是一些我不应该尝试使用的损坏代码。我将为我的 iPad 样式创建一个单独的媒体查询并处理额外的代码。
标签： css ipad responsive-design media-queries