// 动态设置html的字体的大小
const MAX_FONT_SIZE = 42;
//监听 html 文档被解析完成的事件
document.addEventListener("DOMContentLoaded", () => {
// 获取html的标签
const html = document.querySelector('html');
//获取设备的根原生的fontsize的大小,屏幕宽度/10
let fontSize = window.innerWidth / 10;
//获取到的fontSize 不能超过最大值
fontSize = fontSize > MAX_FONT_SIZE ? MAX_FONT_SIZE : fontSize;
// 定义根元素的html的大小 (rem)
html.style.fontSize = fontSize+'px';
})
定义px2rem:
// 定义预计根元素 fontSize 适用于 苹果6 6s 7 8
$rootFontSize : 375 / 10;
//定义 将像素转rem的函数
@function px2rem ($px) {
@return $px / $rootFontSize + rem ;
}