CSS Media Query以1080手机为目标?

时间:2013-04-17 14:53:43

标签: html css media-queries screen-resolution

我正在寻找正确的CSS媒体查询来定位所有手机(不是平板电脑和更大的手机),包括索尼Xperia Z等1080手机。

现在我正在使用:

<link href='style/mobile.css' rel='stylesheet' type='text/css' media='screen and (max-device-width: 767px)' />

适用于大多数设备,但在Android Firefox浏览器中(虽然奇怪的不是Chrome),Xperia Z只能获得桌面版网站。

我试过搜索,但似乎没有人在谈论这些新的高分辨率手机,我应该坚持一个新的标准吗?

3 个答案:

答案 0 :(得分:2)

使用max-width代替max-device-width定位CSS pixels

不要忘记viewport meta。具有大量像素的小型设备仍然具有较低的CSS像素数,因此它只能工作。

答案 1 :(得分:1)

您可以在媒体查询中将宽度与分辨率结合使用。

@media screen and (max-device-width: 767px) and (min-resolution: 300dpi) { … }

答案 2 :(得分:0)

我认为你不会在媒体查询中找到你需要的东西。手机和平板电脑在分辨率上有很大的交叉。

以下是您可以根据w3c ...

查询的媒体功能

http://www.w3.org/TR/css3-mediaqueries/#media1

......似乎没有你想要的东西。

不幸的是,我不知道是否有一个很好的方法可以解决这个问题,即使用户代理也没有什么帮助。