動態計算rem
阿新 • • 發佈:2018-11-20
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'; })