其他分享
首页 > 其他分享> > rem实现移动端完全自适应,1:1还原设计图纸

rem实现移动端完全自适应,1:1还原设计图纸

作者:互联网

js代码

//js动态设置页面的像素比
var iScale=1;
iScale=iScale/window.devicePixelRatio;
document.write('<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no,' +
'initial-scale='+iScale+',maximum-scale='+iScale+',minimum-scale='+iScale+'">');
var iWidth=document.documentElement.clientWidth;
document.getElementsByTagName("html")[0].style.fontSize = iWidth/10+"px";

比如720的设计图纸,h2字体大小36px,宽度400px,那么就这样写:

h2{
    font-size: 36/72rem;
width: 400/72rem;
}

标签:图纸,h2,rem,js,72rem,还原,iScale,var,document
来源: https://blog.csdn.net/weixin_38891273/article/details/122099348