rem 自适应大屏幕
作者:互联网
(function () {
function resize() {
// 设计稿宽度
const designWidth = 1920;
// 屏幕宽度
const windowWidth = window.innerWidth;
// html根元素
const html = document.documentElement;
// 计算
html.style.fontSize = (100 / designWidth * windowWidth) + 'px';
}
resize();
// 动态监听屏幕宽度
// 判断移动端横竖屏事件onorientationchange,若不是,就执行动态监听屏幕宽度
window.addEventListener('onorientationchange' in window ? 'onorientationchange' : 'resize', resize);
// 当初始的 HTML 文档被完全加载和解析完成之后,
// DOMContentLoaded 事件被触发,而无需等待样式表、图像和子框架的完成加载。
// DOMContentLoaded,文档加载完毕,确保能执行
window.addEventListener('DOMContentLoaded', resize)
})(document, window)
标签:const,适应,window,html,DOMContentLoaded,rem,大屏幕,onorientationchange,resize 来源: https://www.cnblogs.com/landuo629/p/15005810.html