一、视图大小
常见的视图大小一般都是750和640两种模式
二、具体操作
1.rem
众所周知,rem布局原理是由根元素的fontsize值来决定的,通常:fontsize=100px=1rpm。这是怎么计算的呢?我们简单以750的设计图为例:
2.正式操作
function rem(){
//根据设备的宽设置html的字体大小
document.documentElement.style.fontSize = document.documentElement.clientWidth/7.5 + "px";
}
rem();
//当窗口改变时,调用方法改变rem比例
window.onresize = rem;
3.提示
当我们调试的时候,会发现没有750px宽度的机型,这时候我们可以找宽度为375px的机型,然后此时的比例为50px=1rpx。原理如下:
let width = document.documentElement.clientWidth
//。。。fontSize = 100*(width/750)+'px'原来
。。。fontSize = 100*(width/(750/2))+'px'=100*(2*width/750)//现在
竟然之前比例为100:1,那么多除2就变成啦50:1