记得之前遇到过一个css样式的问题,找builder同学,搞了半天才发现原来是因为缩放问题引起。
1、浏览器页面缩放,即浏览器页面内容的缩放,使用符号:ctrl + (+/-)来实现页面内容的放大/缩小。
2、所以是不是在遇到样式、文字掉下来的时候,是不是考虑先看看是否页面缩放了!
另外,为了增强用户体验,可以增加对用户的提醒,用户可能不小心点击了快捷键导致页面缩放——变形,而不知所措时,可以提醒用户。
方法如下:
1. window.devicePixelRatio
该参数是设备上物理像素和设备独立像素的比例,该属性就可以用于检测网页是否被缩放了。
FF、Chrome支持。
默认比例是1,放大则大于1,否则小于1.
2. IE 提供了 window.screen.deviceXDPI 和 window.screen.logicalXDPI 两个属性。
deviceXDPI 就是对应的设备上的物理像素,而 logicalXDPI 就是对应了设备独立像素的比例。
在 windows XP+ 以上的系统上的默认值都是 96,因为系统默认的就是 96dpi 。
默认两者相比是1.如果放大,deviceXDPI 则变大。否则变小。