移动开发像素知识

一.像素知识

px(pixels):CSS逻辑像素，浏览器使用抽象单位；

dp(device independent pixels):设备无关元素;是开发写layout的时候使用的尺寸单位，sp是开发写layout时关于字体的字号单位，且dp与sp总为1：1关系。

dpr:devicePixelRatio:设备像素缩放比

1px=(dpr)^2*dp;

eg:对于iphone5,dpr=2,所以640dp*1136dp=320px*568px;

 

DPI/PPI:单位英寸内像素密度;

eg:iphone5,dpi=((640^2+1136^2)^1/2)/4=326ppi,属于Retina屏幕;

 

 

二.viewpoint:

度量viewpoint：document.body.clientWidth;

展现viewpoint:window.innerWidth;

手机默认缩放比：window.innerWidth/document.body.clientWidth(手机自动设置)

 

总结：最佳viewpoint设置：布局viewpoint=设备宽度=度量viepoint