移动web开发----像素知识

Pixel

iPhone5对外宣称的640*1136是指它的物理像素，而我们实际开发中用的px是指逻辑像素

px:
css pixels逻辑像素，浏览器使用的抽象单位，可以根据不同的设备和关系变大变小的。

dp，pt:
device independent pixels设备无关像素，就是说我这个设备的物理像素是固定的，不像抽象像素那样可大可小，它在物理世界这么大就这么大。它们两者的关系是通过dpr来计算的。

dpr:
devicePixelRatio 设备像素缩放比。

计算公式是：1px = (dpr)²*dp

为什么iPhone5是320px*568px? 因为它的 dpr = 2

也就是
在平面上：1px = 2² *dp ，一个css像素等于四个物理像素；
在纬度上：1px = 2*dp , 一个css像素等于两个dp的长度。因此640dp *1136dp = 320px * 568px

继续哈。。。

DPI：
打印机每英寸可以喷的墨汁点（印刷行业）
PPI:
屏幕每英寸的像素数量，即单位英寸内的像素密度
计算公式：以iPhone5为例，iPhone5大小是4英寸。
ppi = √1136²+640² /4 = 326 ppi (视网膜Retina屏)
*

注意：在计算ppi的时候要用物理像素去计算而不是px

PPI越高，像素数就会越高，图像就会越清晰

但可视度越低（小），系统默认设置缩放比越大。

Retina屏（高清屏）：dpr都是大于等于2。
iPhone6 plus dpr 等于 3
dpr会产生系统默认缩放比，比如，iPhone5的ppi是326ppi所以对应的dpr是2.0