08前端成长日记-什么是REM

180 阅读1分钟

什么是REM(root em)

html根元素的font-size大小,默认的是16px

我们知道在伸缩布局中宽度的值可以是屏幕宽的百分之几,但是高的值用百分比却没有用。 为了让宽高等比例缩放,所以必须满足height和width基于同一个尺寸做百分比

解决方案:让REM的值等于屏幕的宽度,这样width和height值就可以REM的多少倍来定义

//让rem等于页面宽度
var pageWidth = window.innerWidth
document.write("<style>html{font-size:"+ pageWidth +"px}</style>")

但是这样换算起来会比较麻烦,所以我们可以利用sass自动将px换算成rem