因为最近有个移动端的小项目，在此稍微学习下移动端开发基础概念。免得用框架的时候莫名其妙。
px(CSS pixels)：逻辑像素，浏览器使用的抽象单位；
dp,pt(device independent pixels)：设备无关像素；
dpr(devicePixelRatio)：设备像素放缩比；
计算公式：1px = (dpr)^2 * dp
下面先解释下dp，为设备像素放缩比：
高清屏(Retina屏)：dpr都是大于等于2的。
以iPhone5为例，为640dp*1136dp。设备像素放缩比为2.0。
根据上面的公式可以得1px = (2)^2 * dp，这个是平面上的，那纬度上的就位：1px = 2 * dp；
所以：640dp * 1136dp => 320px * 568px
然后解释下上面那个ppi相关的概念：
DPI：打印机每英寸可以喷的墨汁点；
PPI：屏幕每英寸的像素数量，即单位英寸类的像素密度；
这个像素是指硬件像素非px；
以iphone5为例：
ppi = √(1136^2 + 640^2) / 4 = 326ppi (视网膜Retina屏)
PPI越高，像素越高，图像越清晰。
如下栗子：
下面是关于html下面的viewport相关。
在移动端的开发我们一般会加这句话：
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0, user-scalable=no">就可以适应移动端了。
这里来简单说下里面的属性：
width：设置布局viewport的特定值（“device-width”）；
initial-scale：设置页面的初始缩放；
minimum-scale：最少缩放；
minimum-scale：最大缩放；
user-scalable：用户能否缩放；
