动态计算rem

a.scss文件

@function px2rem($px){

    $rem:37.5px;

    @return ($px / $rem) + rem;

}

.hello {

    width : px2rem(100px);

    height:px2rem(100px);

    &.b{

        width:px2rem(50px);

        height:px2rem(50px);

    }

}



js文件

//获取屏幕宽度viewport

let htmlWidth = document.documentElement.clientWidth() || document.body.clientWidth();

//获取html的dom

let htmlDom = document.getElementsByTagName('html')[0];

//设置html的fontsize

htmlDom.style.fontSize = htmlWidth / 10 + 'px';

window.addEvenListener('resize',(e)==>{

   let htmlWidth = document.documentElement.clientWidth() || document.body.clientWidth();

    htmlDom.style.fontSize = htmlWidth /  10 + 'px';

})

猜你喜欢

转载自blog.csdn.net/qq_36457584/article/details/80973615
rem