rem适配移动端
rem:是一个相对单位,相对根元素字体大小的单位
html{
font-size:100px;/*1rem=100px*/
}
计算:
1(px)/实际屏幕宽 = 1(rem)/设计屏幕宽
1(rem) = 设计屏幕宽*(1(px)/实际屏幕宽)
以设计屏幕宽为750px为例:
function(()=>{
let body=document.getElementsByTagName("body")[0];
let screenWidth = body.offsetWidth
body.style.margin = 0;
document.getElementsByTagName("html")[0].style.fontSize = screenWidth / 750 * 100 + "px"
})()
这样设计稿的1px相当于浏览器中的0.01rem;