我像素的理解

1.设备独立像素（device-independent pixels (dips)）设备独立像素(也叫密度无关像素)，可以认为是计算机坐标系统中得一个点，这个点代表一个可以由程序使用的虚拟像素(比如: css像素)，然后由相关系统转换为物理像素。所以说，物理像素和设备独立像素之间存在着一定的对应关系。

不管是移动端还是PC端通过screen.width/height 获取的这个值是设备独立像素（CSS 像素），而不是设备的屏幕分辨率，因为设备的屏幕分辨率对于WEB开发者来说是无法通过代码来获得的，是完全透明的。

2.物理像素是构成整个屏幕的基础组件，也是最小物理单位，1个独立像素可由多个物理像素构成，如2*2个，3*3个等。

3.设备像素比（devicePixelRatio）是组成一个独立像素的物理像素数（即线长如横向、纵向、对角线）；或者说线长（横向、纵向、对角线）上的物理像素数与设备独立像素数的对应关系。在javascript中，可以通过window.devicePixelRatio获取到当前设备的dpr。

在css中，可以通过-webkit-device-pixel-ratio，-webkit-min-device-pixel-ratio和 -webkit-max-device-pixel-ratio进行媒体查询，对不同dpr的设备，做一些样式适配(这里只针对webkit内核的浏览器和webview)。

4.分辨率：日常所说的“这张图片的尺寸（或分辨率）是100x100像素”，一般都是在描述数字图片，这样的描述只是说明了图片文件包含多少个像素。比如图1中的七张图，我们习惯于说，第1张图的分辨率是1x1像素，第5张图的分辨率是20x20像素，其实只是说明了图片的像素数而已。