px, em, rem, rpx 你都明白是啥吗？
定义
像素 Pixel
像素是图像的基本采样单位，他不是一个确定的物理量，像素的物理大小是不确定的。
位图像素
又称图像像素，是图像在保存为在计算机里时的最小数据单元，也就是说任意图片都是由无数位图像素组成，也就是使用ps放大图片到最后显示的那一个个小格子。
物理像素
图像像素无法确定，但设备在制作的时候必须有一个标准才能做，物理像素就是设备显示器的最小发光点。
设备独立像素
由于生产商的标准不同，物理像素也不近相同，但软件系统设计时却必须统一标准才行，于是定义了设备独立像素，又称密度无关像素，
他是计算机处理图像时使用的虚拟像素，比如 css 中的 px。
显然，设备独立像素是不能大于物理像素的。
设备像素比
设备像素比 = 物理像素 / 设备无关像素 单位： dpr
苹果公司研发的 retina屏幕 与普通屏幕的区别就在这里，
普通屏幕 dpr 为 1，而 retina屏幕 dpr 为 2，
也就是说
普通屏幕显示 图像像素时 一个物理像素表示一个设备独立像素，1：1
而 retina屏幕 显示图像时，4个个物理像（横2，纵2）素表示一个设备独立像素，这就是 retina屏幕细腻的原因所在。
分辨率
分辨率是屏幕像素的数量，一般以屏幕的宽（横向像素数量）乘以高（纵向像素数量）来表示，
分辨率又分为逻辑分辨率和物理分辨率，例如 iphone6 的逻辑分辨率：375 * 667.
但 iPhone 6 采用的是 retina屏幕，那显而易见 iphone 6 的物理分辨率为：750 * 1334.
所以为了保证清晰度，iphone 6 的产品设计图一般采用 750 * 1334 的分辨率。
下面就说说开发时市面上几种主流单位
px
即图片的基本采样单位，设备的逻辑像素，密度无关像素，设备独立像素。
rem
是 html 中 依据根元素字体大小计算的相对单位，一般在移动端开发中使用，具体方法为获取设备宽度动态设置根元素字体大小，来保证各种设备上显示效果一致。
em
html 中 依据父元素字体大小计算的相对单位。
rpx 小程序推荐单位
rpx 实际是 rem 的微信小程序各种设备适配解决方案，官方规定设备屏幕的宽度为 20rem，750rpx，即 1rem = 750 / 20 = 35rpx
对于 iphone 6 来说，750 / 750 = 1，即 1rpx 就是 1px。
