设备像素比：devicePixelRatio，其实指的是window.devicePixelRatio, 被所有WebKit浏览器以及Opera所支持。
window.devicePixelRatio是设备上物理像素和设备独立像素(device-independent pixels (dips))的比例。 公式表示就是：window.devicePixelRatio = 物理像素 / dips；
dip或dp,（device independent pixels，设备独立像素）与屏幕密度有关。dip可以用来辅助区分视网膜设备还是非视网膜设备。
非视网膜屏幕上 window.devicePixelRatio 等于1；
视网膜屏幕上 window.devicePixelRatio 等于2；
CSS 中的像素是一个相对值，不是绝对值，因此1px 的 CSS 像素并不一定等于 1px 的物理像素。 CSS 中的像素单位只是一种规范，最终的显示是取决于物理设备的。物理设备根据某种规则，决定该采用几个物理像素去显示 1px 的 CSS 像素，这个规则就是设备像素比。
当设备像素比为1:1时，使用1（1×1）个设备像素显示1个CSS像素；
当设备像素比为2:1时，使用4（2×2）个设备像素显示1个CSS像素；
当设备像素比为3:1时，使用9（3×3）个设备像素显示1个CSS像素。
详细讲解参考：
https://www.zhangxinxu.com/wordpress/2012/08/window-devicepixelratio/
https://blog.csdn.net/qq_42068550/article/details/90736240
