前端的一些基本术语
2016-03-30 阅读 262
### 物理像素（physical pixel）
一个物理像素是显示器（手机屏幕）上最小的物理显示单元，在操作系统的调度下，每个设备像素都有自己的颜色值和亮度值。
### 设备独立像素（density-independent pixel）
设备独立像素（也叫密度无关像素），可以认为是计算机坐标系统中的一个点，这个点代表一个可以由程序使用的虚拟像素（比如：css像素），然后由相关系统转换为物理像素。
所以说物理像素和设备独立像素之间存在着一定的对应关系，这就是接下来所说的设备像素比。
### 设备像素比（device pixel ratio）
设备像素比（简称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）。
更新于 2023年03月28日
