介绍了各手机的像素密度_(-webkit-min-device-pixel-ratio)_响应式布局

最新推荐文章于 2024-10-09 09:34:27 发布

张广森

最新推荐文章于 2024-10-09 09:34:27 发布

阅读量9k

点赞数

分类专栏： html5 css

css 同时被 2 个专栏收录

33 篇文章 0 订阅

订阅专栏

html5

6 篇文章 0 订阅

订阅专栏

响应式布局—设备像素密度测试 (-webkit-min-device-pixel-ratio)

最近遇到这种头疼的问题，百思不得其解，不耻下问，悬梁刺股这些事情都做过之后，终于看到希望，于是攒见好就收，感觉整理分享给大家，希望有所帮助。

对手机分辨率和网页像素的初步认识是，是2倍的差别。

但是让人费解的是为什么还要 1.325 这种数据呢，原来是这么回事：

举个栗子：

以下是我摘抄并翻译的，想了解更多原文在尾部有链接哈~


-webkit-min-device-pixel-ratio的常见值对比（是设备上物理像素和设备独立像素，设备像素比率）

设备分辨率设备像素比率Android LDPI 320×240 0.75 Iphone 3 & Android MDPI 320×480 1 Android HDPI 480×800 1.5 Iphone 4 960×640 2.0

设备像素为:1.0 (-webkit-min-device-pixel-ratio)

所有non-Retina mac电脑
苹果iPhone(第一代)
苹果iPhone 3 g
苹果iPhone 3 gs
苹果iPad(第一代)
苹果iPad 2
苹果iPad迷你(第一代)
宏碁Iconia A500
三星Galaxy Tab 10.1
三星Galaxy S

设备像素为:1.3 (-webkit-min-device-pixel-ratio)

华硕MemoPad高清7
谷歌Nexus 7(2012型)

设备像素为:1.4 (-webkit-min-device-pixel-ratio)

诺基亚流光(Lumia)520

设备像素为:1.5 (-webkit-min-device-pixel-ratio)

谷歌Nexus S
HTC欲望
HTC Desire HD
HTC不可思议的年代
HTC速度
宏达电的感觉
Kindle Fire高清
三星Galaxy S II
索尼平板电脑Xperia Z
索尼Xperia U

设备像素为:2.0 (-webkit-min-device-pixel-ratio)

所有mac视网膜显示器
苹果iPhone 4
苹果iPhone 4 s
苹果iPhone 5
苹果iPhone 5度
苹果iPhone 5 s
苹果iPhone 6
苹果iPad(第三代)
苹果iPad 4
苹果iPad的空气
苹果iPad迷你(2rd代)
HTC一条X
谷歌的Galaxy Nexus
谷歌Nexus 4
谷歌Nexus 7(2013型)
谷歌Nexus 10
摩托罗拉极限摩托
三星Galaxy S三世
三星Galaxy注意二世
索尼Xperia年代
索尼Xperia T