那些个像素

Posted 2020-07-19 fnncat

1，物理像素(physical pixel)

一个物理像素是显示器(手机屏幕)上最小的物理显示单元，在操作系统的调度下，每一个设备像素都有自己的颜色值和亮度值。

2，dpr  

设备像素比(简称dpr)定义了物理像素和设备独立像素的对应关系，它的值可以按如下的公式的得到：

设备像素比 = 物理像素 / 设备独立像素 // 在某一方向上，x方向或者y方向

在javascript中，可以通过window.devicePixelRatio获取到当前设备的dpr。

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

这个参数实际上量化了屏幕的物理分辨率和显示清晰度，比如iphone的DPR就是2，比一般的手机都要高。

dpr是设备像素比的意思，dppx是每像素有移少点的意思

dpi和屏幕尺寸（英寸）以及分辨率有关系，dpi是每英寸有多少个点么 401 = sqrt(1080 * 1080 + 1920 * 1920) / 5.5，在开发中你不用关心它。‘
写代码的时候只要关注dpr就可以了，网页的视口的大小是设备分辨率/dpr ，比如iphone 6p是1080p的，但是dpr是2.46，所以实际页面大小是440 * 780 这个分辨率对于苹果设备开发绝对是一个灾难，因为大部分1080p的设备的dpr都是3

 

3，设备独立像素

设备独立像素(也叫密度无关像素)，可以认为是计算机坐标系统中得一个点，这个点代表一个可以由程序使用的虚拟像素(比如: css像素)，然后由相关系统转换为物理像素。

所以说，物理像素和设备独立像素之间存在着一定的对应关系，这就是接下来要说的设备像素比。

 

4，