美文网首页
PC端动态修改rem 移动端适配问题

PC端动态修改rem 移动端适配问题

作者: 情话_2ee5 | 来源:发表于2018-07-04 11:03 被阅读0次

    rem = body.font-size  /   html.font-size

    var clientWidth = document.documentElement.clientWidth || document.body.clientWidth;

        //计算比例

        var per = clientWidth / 375;

        document.documentElement.style.fontSize = per * 100 + "px";

        window.onresize = function() {

            var clientWidth = document.documentElement.clientWidth || document.body.clientWidth;

            //计算比例

            var per = clientWidth / 375;

            document.documentElement.style.fontSize = per * 100 + "px";

        }

    给   

    目的是:

    body给font-size,html也给font-size建议给100px,这样的话转换的时候就会容易计算。

    rem  =    body.font-size   /    html.font-size  

    然后在js中添加函数,window.onload  和window.onresize 函数。即在页面加载完成和页面宽度发生变化的时候执行。

    具体方法如下。

    相关文章

      网友评论

          本文标题:PC端动态修改rem 移动端适配问题

          本文链接:https://www.haomeiwen.com/subject/ahqeuftx.html