媒体查询目标高分辨率密集像素设备(Media queries to target high reso

我们正在尝试专门针对三星的Galaxy Nexus。 它具有1280×720为2的像素密度，这会导致它，就好像是在桌面设备上显示的页面的分辨率。

我们试过

@media screen and (max-device-width : 720px) and (-webkit-max-device-pixel-ratio : 2) and (portrait) {};

和

@media screen and (max-device-width : 720px) and (-webkit-max-device-pixel-ratio : 2) {};

以及其它各种组合。 我们似乎无法定位到该设备专而不影响无论是台式机，平板电脑或其他手机布局。

任何帮助，将不胜感激。

Answer 1:

媒体查询是不正确的：

@media only screen
and (min-device-width : 720px)
and (-webkit-min-device-pixel-ratio : 2)
and (orientation : portrait) { /* styles */ };

@media only screen
and (min-device-width : 720px)
and (-webkit-min-device-pixel-ratio : 2) { /* styles */ };

不知道你试图用第二个目标是什么。 您可能需要考虑增加以下媒体查询：

@media only screen
and (min-device-width : 1280px)
and (-webkit-min-device-pixel-ratio : 2)
and (orientation : landscape) { /* styles */ };

尝试了这一点。

文章来源: Media queries to target high resolution dense pixel devices