【问题标题】: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 浏览器的类似媒体查询是什么?

【问题讨论】:

  • 我删除了javascript标签并添加了mediaqueries标签。

标签: android css browser media-queries


【解决方案1】:
@media only screen and (min-device-width: 800px) and (max-device-width: 1280px) { … }

见:http://webdesign.about.com/od/css3/a/css3-media-queries.htm

【讨论】:

  • 你不小心交换了最小值和最大值
  • @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,因此宽度为1280800

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

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

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

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

【讨论】:

  • ok.. Opera 是适用于所有 Android 平板电脑的浏览器吗?如果是,相同的样式集能否在所有 Android 平板电脑上正常工作?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-01-14
  • 2012-06-11
  • 2011-04-19
  • 2011-09-24
  • 2011-07-25
  • 2012-12-30
相关资源
最近更新 更多