包括仅适用于桌面浏览器的样式表

Question

我可以为不同的分辨率包含样式表，如下所示：

<link rel="stylesheet" media="screen and (min-device-width: 800px)" href="min800.css" />

但我想仅将样式表包含在桌面浏览器中，而不是iPad，iOS，移动浏览器。

我该如何使用？

Answer 1

您可以使用Modernizr等功能检测库来检查触摸事件。

你不能只看一下用户代理吗？我知道它可以被覆盖但它仍然可以很好地工作。查看Detect Mobile Browsers了解一些想法。

修改

来自评论：

  

嗨！感谢链接检测移动浏览器。我会用这个。但这只是检查移动设备而不是iPad等平板电脑。那么，我该如何修改？我使用的是php版本。

iPad用户代理如下所示：

Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B334b Safari/531.21.10

所以找到正则表达式的部分看起来像这样：

ip(hone|od)

并改为：

ip(hone|od|ad)

另外，您可以通过这样的自定义测试让Modernizr检测iPad：

Modernizr.addTest('ipad', function () {
  return !!navigator.userAgent.match(/iPad/i);
});

或者您可以使用像Detectizr这样的插件为您付出艰苦的努力。

我希望这会有所帮助。