(() => { let resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'; let width = document.documentElement.clientWidth; let Obody = document.documentElement; Obody.style.width = width + 'px'; let newSize = () => { Obody.style.fontSize = (width / 19.2 * 1.25) + 'px' } window.addEventListener(resizeEvt, newSize, false); newSize(); })()
(() => { let resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'; let height = document.documentElement.clientHeight; let Obody = document.documentElement; Obody.style.height = height + 'px'; let newSize = () => { Obody.style.fontSize = (height / 375) + 'px' } window.addEventListener(resizeEvt, newSize, false); newSize(); })() 不用width的原因是兼容华为的容颜系列手机 荣耀系列手机他的body高度和屏幕高度一样。 屏幕高度包含了最下面那个黑色的按键区域。 但是容器如果和body一样高的话,对于刚好占满一屏幕的页面, 最下面会有一部分被黑色的按键挡住。
博主联系方式:
- 微信:34419369
- QQ: 34419369
- 公众号:前方录
- 有什么不懂的地方欢迎联系我,帮到你是我会很开心