写一个js配合rem

rem.js

动态设置rem的根字体大小

/**

* design: 是设计稿的宽度，也是页面的最大宽度

* 这里的比例是1:100; 1rem = 100px;

**/

function setRem(design=750){

    rem();

    window.onresize = function(){

        rem();

    }

    function rem(){

        let winWidth = document.documentElement.getBoundingClientRect().width;

        winWidth = Math.min(winWidth,design);

        let fontSize = winWidth / design *100;

        document.documentElement.style.fontSize = fontSize+'px';

        document.body.style.fontSize = '16px';

        // 这里要注意， 系统字体的缩放是会影响到rem的

        let computedRem = window.getComputedStyle(document.documentElement)['font-size'].replace('px','');

        document.documentElement.style.fontSize=fontSize*fontSize/computedRem+'px';

    }

}