rem初始化

时间:2023-06-18 17:40:14

使用css实现rem适配,头部引入即可

adaptive.js

!function(e, t) {
function i() {
o = ,
e.devicePixelRatioValue = o,
s = / o;
var t = a.createElement("meta");
if (t.setAttribute("name", "viewport"), t.setAttribute("content", "initial-scale=" + s + ", maximum-scale=" + s + ", minimum-scale=" + s + ", user-scalable=no"), d.firstElementChild) d.firstElementChild.appendChild(t);
else {
var i = a.createElement("div");
i.appendChild(t),
a.write(i.innerHTML)
}
}
function n() {
var e = Math.min(d.getBoundingClientRect().width, );
r = * e / t.desinWidth,
d.style.fontSize = r + "px"
}
var a = e.document,
d = a.documentElement,
o = (e.devicePixelRatio, ),
s = ;
i();
var l, r = ;
t.desinWidth = ,
t.baseFont = ,
t.init = function() {
e.addEventListener("resize",
function() {
clearTimeout(l),
l = setTimeout(n, )
},
!),
e.addEventListener("pageshow",
function(e) {
e.persisted && (clearTimeout(l), l = setTimeout(n, ))
},
!),
"complete" === a.readyState ? a.body.style.fontSize = t.baseFont * o + "px": a.addEventListener("DOMContentLoaded",
function() {
//a.body.style.fontSize = t.baseFont * o + "px"
},
!),
n(),
d.setAttribute("data-dpr", o)
}
} (window, window.adaptive || (window.adaptive = {}));
window['adaptive'].desinWidth = ;//根据设计稿修改这个
window['adaptive'].init();

body {
max-width: 6.4rem;
min-width: 3.2rem;
}