检测 Xoom 浏览器 (Android)答案

【问题标题】：Detect Xoom browser (Android)检测 Xoom 浏览器 (Android)
【发布时间】：2011-08-11 09:19:11
【问题描述】：

如何使用 CSS Media 检测 Motorola Xoom 浏览器？

例如对于 iPad，我使用 @media only screen and (device-width:768px)

摩托罗拉 Xoom 浏览器的类似媒体查询是什么？

【问题讨论】：

【解决方案1】：

@media only screen and (min-device-width: 800px) and (max-device-width: 1280px) { … }

【讨论】：

你不小心交换了最小值和最大值
@levu - 啊，谢谢！我从 about.com 教程中复制并粘贴了那条有问题的行；）
非常感谢..我有 2 个问题； 1. 如果我使用上面的媒体查询，我可以确定它只会针对 Xoom 浏览器或者可能有很多设备宽度在 800 到 1280px 之间 2. 如果我想应用 ipad.css 和 xoom.css 相同HTML 文件，我能否确定使用 2 个单独的媒体查询，不会出现任何不正确的巧合，并且不会将错误的 CSS 应用于任何设备。
很抱歉稍微转移了一点，但我有一个与 CSS 媒体查询相关的类似问题。一旦我从这个答案中得到答案，我就会关闭它。看看现在我正在实施对于 desktop.css 和 ipad.css 并希望它们在 2 个单独的文件中..在 desktop.css 中，我使用 @import url("ipad.css");并且还添加 @media 不仅具有实际桌面样式的屏幕和 (device-width:768px) 块。现在，虽然 iPad CSS 在 iPad 上正确应用，但由于某种原因，桌面 CSS 没有得到应用。不确定“@media not only screen ...”的磨损情况。

【解决方案2】：

屏幕分辨率为1280x800，因此宽度为1280或800：

@media only screen and (device-width:800px)

或

@media only screen and (device-width:1280px)

因此您还可以根据设备方向使用其他布局。

虽然，我不会只依赖设备宽度。如果你真的想检测 Xoom 浏览器，你唯一的可能就是查看用户代理字符串，因为有很多屏幕都有这个尺寸。对于我的网站，我不使用特殊的平板电脑版本，平板电脑浏览器非常好，它们不需要额外的照顾（不像 IE ;)）。对于我的网站，我设计了普通版和移动版。

【讨论】：