为了账号安全,请及时绑定邮箱和手机立即绑定

使用js动态设置font-size,小米自带浏览器无效

使用js动态设置font-size,小米自带浏览器无效

富国沪深 2019-05-25 15:48:31
functionc(){varb=f.getBoundingClientRect().width;b/i>540&&(b=540*i);varc=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}这里最后执行后设置的是html的font-size为36px;页面使用rem,但是在小米自带浏览器上发现页面所有元素都要比预期的小,于是我便打印了一下:console.log(getComputedStyle(window.document.documentElement)['font-size']);//31pxconsole.log(window.document.documentElement.style.fontSize)//36px发现浏览器最终使用的font-size是31不是36,但是第二行代码得到是我设置的值36px。搞不懂啊!!在其他浏览器上是正常的,两个打印出来的都是36px
查看完整描述

2 回答

?
墨色风雨

TA贡献1853条经验 获得超6个赞

这个可能是app在小米手机上的一个bug,我直接行内在html标签上设置font-size也不行。最后只能通过getComputedStyle(window.document.documentElement)['font-size']来判断是不是小于32px,是就加载另一个css文件,这个css文件是根据font-size=31px来写的rem布局。就这样,问题暂时告一段落。。。
                            
查看完整回答
反对 回复 2019-05-25
?
Smart猫小萌

TA贡献1911条经验 获得超7个赞

(function(doc,win){
vardocEl=doc.documentElement,
resizeEvt='orientationchange'inwindow?'orientationchange':'resize',
recalc=function(){
varclientWidth=docEl.clientWidth;
if(!clientWidth)return;
docEl.style.fontSize=20*(clientWidth/320)+'px';
};
if(!doc.addEventListener)return;
win.addEventListener(resizeEvt,recalc,false);
doc.addEventListener('DOMContentLoaded',recalc,false);
})(document,window);
你可以用这种写法来试试,根据屏幕宽度来计算html的fontSize
                            
查看完整回答
反对 回复 2019-05-25
  • 2 回答
  • 0 关注
  • 817 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信