分享一下自己一直使用rem布局的函数 很方便 sass语法也很优美
直接上代码 这段js代码放在html文件
<script>
function placeholderPic() {
var w = document.documentElement.offsetWidth;
document.documentElement.style.fontSize = w / 10 + 'px';
}
placeholderPic();
window.onresize = function () {
placeholderPic();
}
</script>
我使用的是sass编译很方便
推荐使用koala 编译sass 附上地址 http://koala-app.com/index-zh.html
这段 函数代码放在scss文件里 解释一下75的意思是750的设计稿 如果你是1920的那就是192 分成10等分
ptr 这个函数名你随便取用 不一定是ptr
@function ptr($p) {
@return $p/75+rem;
}
这样就不用去算rem了 直接上使用方法
div {
width: ptr(108);
height: ptr(30);
margin-left: ptr(15);
}
ps:这种代码直接写在css是不可以的 是sass函数语法 跟css基本上一样