移动开发像素知识
一.像素知识
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