视觉设计

设备像素比是物理像素与设备无关像素的比值，单位可以用dppx。它用于描述整个渲染环境在硬件设备上的缩放程度。在程序中可以通过window对象上的devicePixelRatio属性来得到这个值。它是只读的，但不是常量，对浏览器的一些特殊操作会改变这个值。
　　首先是对几个概念的解释
　　物理像素（physical pixel）：设备能控制显示的最小单位。
　　设备独立像素（DIP，device-independent pixel，density-independent pixel）：独立于设备的用于逻辑上衡量像素的单位。
　　每英寸像素量（PPI，pixels per inch）：一英寸长度上可以并排的像素数量。
　　正常人眼可以识别的分辨率为300PPI，而现在很多设备的分辨率都超过了300PPI。如果设备总是以满分辨率来显示东西就可能造成文字太小，人们看不清。因此像浏览器这样的软件就会对内容做一次放大后再进行渲染，也就是降低分辨率。要降低分辨率就需要让像素这个单位变大，因此PPI的计算不再使用物理像素，而改用设备独立像素。那么设备独立像素和物理像素之间就存在一个比例差异，这就是设备像素比。
　　单位dppx（dots per pixel）表示每个DIP占用几个物理像素。或者说，CSS中的单位px在屏幕上占用了多少物理像素。在PC上，这个值通常为1。但浏览器提供了缩放功能，它实际上就是修改设备像素比来实现的，所以调整浏览器的缩放可以看到devicePixelRatio属性的变化。