您的位置:首页 > 其它

-webkit-min-device-pixel-ratio: 2是什么意思?

2015-04-01 22:46 218 查看
DPI(DPR) stands for Dots Per Inch which technically means printer dots per inch。

这个参数实际上量化了屏幕的物理分辨率和显示清晰度,比如iphone的DPR就是2,比一般的手机都要高。

同样的图片在不同手机上显示的效果就有很大不同,特别是对于apple设备,由于其DPR比较高,因此一般必须对其

应用分辨率高的图片显示效果才能得到保证。

常见的,可以使用media query来应用不同的style

@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
/* Retina-specific stuff here */
}


对于如何实现在苹果高分辨率手机上去应用高分辨率的图片,有一个叫做retina.js的js代码,可以实现相应功能,为了方便使用,

设置有相应的less/sass mixin以便方便开发者使用

下面是常见手机型号的参数值:

-webkit-min-device-pixel-ratio为1.0

所有非Retina的Mac

所有非Retina的iOS设备

Acer Iconia A500

Samsung Galaxy Tab 10.1

Samsung Galaxy S

-webkit-min-device-pixel-ratio为1.3

Google Nexus 7

-webkit-min-device-pixel-ratio为1.5

Google Nexus S

Samsung Galaxy S II

HTC Desire

HTC Desire HD

HTC Incredible S

HTC Velocity

HTC Sensation

-webkit-min-device-pixel-ratio为2.0

iPhone 4

iPhone 4S

iPhone 5

iPad (3rd generation)

iPad 4

所有Retina displays 的MAC

Google Galaxy Nexus

Google Nexus 4

Google Nexus 10

Samsung Galaxy S III

Samsung Galaxy Note II

Sony Xperia S

HTC One X
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: