具体代码如下所示：
//设置根元素字体
var
win
=
window,
doc
=
document
function
setFontSize()
{
var
winWidth
=
$(window).width()
//750这个数字是根据你的设计图的实际大小来的，所以值具体根据设计图的大小
var
size
=
(winWidth
/
750)
*
100
doc.documentElement.style.fontSize
=
(size
<
100
?
size
:
100)
+
'px'
}
//这里我们给个定时器来实现页面加载完毕再进行字体设置
setTimeout(function()
{
//初始化
setFontSize()
},
100)
以上所述是小编给大家介绍的Js动态设置rem来实现移动端字体的自适应代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
既然已经做到了“在更改文本时自动调整文本大小”，那么你可以在onload事件中把这个操作自动运行一遍，这样当加载该Document时文字大小就会自动改变了：window.onload = Function() {
//这里放入你的“自动调整文本大小”的代码
}
还有一点要注意：一定要在页面完全加载完毕才进行字体调整，否则就会出现“一闪而过，很快字体又变大了”的情况。所以一定要在window.onload事件中进行。
html动态设置根字体大小（页面字体使用rem单位可根据屏幕大小自适应）
1.新建rem.js文件
(function(doc, win) {
let docEl = doc.documentElement,
resizeEvt ='orientationchange' in window ?'orientationchange' :'resize',
recalc =function() {
let clientWidth = docEl.clientWidth
if ( !clientWidth )return
if ( clientWidth ===320 ) {
docEl.style.fontSize =24 * (clientWidth /320) +'px'
}
else {
docEl.style.fontSize =20 * (clientWidth /320) +'px'
}
}
if ( !doc.addEventListener )return
win.addEventListener(resizeEvt, recalc, false)
doc.addEventListener('DOMContentLoaded', recalc, false)
})(document, window)
2，将文件引入到main.js执行
