![3bef1c1cb23ae7cd715d54c2a3240b84.png](https://i-blog.csdnimg.cn/blog_migrate/e38a5b9660fbb6a515bef39d35009110.jpeg)
<!-- 移动端适配解决方案 -->
<script type="text/jscript">
function adapt(designWidth, rem2px) {
var d = window.document.createElement('div');
d.style.width = '1rem';
d.style.display = "none";
var head = window.document.getElementsByTagName('head')[0];
head.appendChild(d);
var defaultFontSize = parseFloat(window.getComputedStyle(d, null).getPropertyValue('width'));
d.remove();
document.documentElement.style.fontSize = window.innerWidth / designWidth * rem2px / defaultFontSize * 100 + '%';
var st = document.createElement('style');
var portrait = "@media screen and (min-width: " + window.innerWidth + "px) {html{font-size:" + ((window.innerWidth /
(designWidth / rem2px) / defaultFontSize) * 100) + "%;}}";
var landscape = "@media screen and (min-width: " + window.innerHeight + "px) {html{font-size:" + ((window.innerHeight /
(designWidth / rem2px) / defaultFontSize) * 100) + "%;}}"
st.innerHTML = portrait + landscape;
head.appendChild(st);
return defaultFontSize
};
var defaultFontSize = adapt(750, 100);
</script>
注:
设计图为750px,
例子:大小为210px css: 2.1rem
大小为42px css:.42rem
大小为3px css:.03rem