版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_25354709/article/details/84585834
一、将REM.js 提到要加载的CSS之前
原来是这样的
HTML:
//-> 在页面最底部引入
<script src="../../js/user/user.js"></script>
</body>JS:
//-> 动态设置REM
~function () {
var desW = 640, //设计稿宽度
winW = document.documentElement.clientWidth || document.body.clientWidth; //屏幕宽度
//如果屏幕宽度大于设计稿的宽度
if (winW > desW) {
//$('.main').css('width', desW);
//或者
document.getElementById('main').style.width = desW + 'px';
return;
}
//设置整个页面的HTML的font-size值
document.documentElement.style.fontSize = winW / desW * 100 + 'px';
}();现在，把这段代码，放入这个页面要执行的CSS之前。
更改后：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<link rel="stylesheet" href="../../css/mui.min.css" />
<link rel="stylesheet" href="../../css/main.css" />
<link rel="stylesheet" href="../../plugins/swiper-3.4.2/swiper-3.4.2.min.css" />
<script>
//-> 动态设置REM
~function () {
var desW = 640, //设计稿宽度
winW = document.documentElement.clientWidth || document.body.clientWidth; //屏幕宽度
//如果屏幕宽度大于设计稿的宽度
if (winW > desW) {
//$('.main').css('width', desW);
//或者
setTimeout(function() {
document.getElementById('main').style.width = desW + 'px';
}, 500);
return;
}
//设置整个页面的HTML的font-size值
document.documentElement.style.fontSize = winW / desW * 100 + 'px';
}();
</script>
<link rel="stylesheet" href="../../css/user/user.css" />
</head>
<body>