是否有@media查询只针对运行iOS的设备？
例如:
@media (min-device-width:320px) and (max-device-width:768px) {
#nav {
yada: yada;
}
}
这是否也会改变具有这些设备宽度的Android设备上的页面行为？
是否有@media查询只针对运行iOS的设备？
例如:
@media (min-device-width:320px) and (max-device-width:768px) {
#nav {
yada: yada;
}
}
这是否也会改变具有这些设备宽度的Android设备上的页面行为？
可以，停那儿吧.
@supports (-webkit-touch-callout: none) {
/* CSS specific to iOS devices */
}
@supports not (-webkit-touch-callout: none) {
/* CSS for other than iOS devices */
}
YMMV.
它之所以有效，是因为只有Safari Mobile实现了-webkit-touch-callout:https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-touch-callout
请注意，@supports在IE中不起作用.IE将跳过上面的@support个模块.欲了解更多信息，请参阅https://hacks.mozilla.org/2016/08/using-feature-queries-in-css/.因此，建议not使用@supports not.
iOS上的Chrome或Firefox呢？实际情况是，这些只是WebKit呈现引擎上的皮肤.因此，只要IOS策略不变，上面的方法就可以在IOS上随处可用.请参见App Store Review Guidelines中的2.5.6.
Warning: iOS may remove support for this in any new iOS release in the coming years. You SHOULD try a bit harder to not need the above CSS. An earlier version of this answer used 101 but a new iOS version removed it.正如一位 comments 人士所指出的，还有其他 Select :转到Supported CSS Properties并搜索"iOS上的Safari".