简单的移动端rem布局方法

来源:互联网 发布:二手备案域名交易 编辑:程序博客网 时间:2024/05/17 08:05

为根元素的html设置font-size的字体大小,根据屏幕的宽度来改变字体的大小,来达到自适应的效果,比如设计图的宽度是750px,那就用750/16=46.875px;一个div的宽度是200px,就是200/46.875=4.27rem,小数太多的情况下可以四舍五入;因为设计图宽度多为750px算起来小数特别多特别麻烦,所以把设计图宽度改成640px,算起来就好多了。

<script type="text/javascript">            //rem根元素设置字体大小            document.documentElement.style.fontSize = innerWidth / 16 + 'px';            onresize = function() {                document.documentElement.style.fontSize = innerWidth / 16 + 'px';            };        </script>