美文网首页
window.devicePixelRatio

window.devicePixelRatio

作者: SherrinfordL | 来源:发表于2019-04-24 17:14 被阅读0次
value = window.devicePixelRatio;

devicePixelRatio属性
该 Window 属性 devicePixelRatio 能够返回当前显示设备的物理像素分辨率与 CSS 像素分辨率的比率。此值也可以解释为像素大小的比率:一个 CSS 像素的大小与一个物理像素的大小的比值。简单地说,这告诉浏览器应该使用多少个屏幕的实际像素来绘制单个 CSS 像素。

这在处理标准显示与 HiDPI 或 Retina 显示之间的差异时很有用,它使用更多屏幕像素绘制相同对象,从而产生更清晰的图像。

当此值发生变化时(例如,如果用户将 window 拖到具有不同像素密度的显示器上),则无法通知该值。由于没有可用于检测像素密度变化的回调或事件,因此唯一的方法是定期检查其 devicePixelRatio 值是否已更改。不要经常这样做,否则会影响性能。
PS:说白了,获得设备物理像素与CSS像素比例

像移动端适配,可以在媒体查询设置

相关文章

  • window.devicePixelRatio

    devicePixelRatio属性该 Window 属性 devicePixelRatio 能够返回当前显示设备...

  • js 监控缩放比例

    1. window.devicePixelRatio 张鑫旭博客附:window.devicePixelRatio...

  • 设备像素比devicePixelRatio

    在移动端,devicePixelRatio指的是window.devicePixelRatio。移动端设备分为非视...

  • 移动端布局 rem

    window.devicePixelRatio是设备上物理像素和设备独立像素(device-independent...

  • 关于浏览器版本等问题

    window.devicePixelRatio是设备上物理像素和设备独立像素(device-independent...

  • 移动端dpr

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

  • HTML5-meta标签之视口Viewport

    视口Viewport 设备像素比: window.devicePixelRatio电脑 1低端手机 2高端手机 3...

  • Mac电脑屏幕适配

    window.devicePixelRatio 在mac屏幕下为2,进行canvas绘图的时候,会被放大两倍执行

  • 移动端

    一、移动端尺寸 window.devicePixelRatio 像素比像素比越高,显示出的图像细腻程度越高 在pc...

  • 设备像素比devicePixelRatio

    Window.devicePixelRatio概述 此属性返回当前显示设备的物理像素分辨率与CSS像素分辨率的比值...

网友评论

      本文标题:window.devicePixelRatio

      本文链接:https://www.haomeiwen.com/subject/trtngqtx.html