打开chrome浏览器,模拟手机调试,iphone6/7/8 行显示的 375*667, DPR:2如何理解呢?这就需要理解一下几个概念:
设备像素
设备像素又称物理像素(physical pixel),设备能控制显示的最小单位,我们可以把这些像素看作成显示器上一个个的点。
设备独立像素
(也叫密度无关像素),可以认为是计算机坐标系统中的一个点,这个点代表一个可以由程序使用并控制的虚拟像素(比如:CSS 像素,只是在android机中CSS 像素就不叫”CSS 像素”了而是叫”设备独立像素”),然后由相关系统转换为物理像素。
所以说,物理像素和设备独立像素之间存在着一定的对应关系。在web开发中可以理解为css像素。
PPI/DPI
PPI/DPI 是像素密集度,表示屏幕每英寸(对角线)拥有的像素个数,PPI/DPI 的计算方式如下(以 IPhone6 为例):
计算出的 IPhone6 的 PPI 为:325.16。该结果表示在 IPhone6 上,每英寸有 325.16 个物理像素,四舍五入为 325 个物理像素。
可以发现:这个 PPI 的值近似等于 IPhone6 这个设备的水平