移动端使用rem做适配

1rem=100px
1.首先先获取设备屏幕的宽度,以下采用兼容的写法

 let htmlWidth= document.documentElement.clientWidth || document.body.clientWidth

 console.log(htmlWidth)

2.通过标签选择器获取根元素html标签

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

3.用设备的宽度除10,然后把得到的数值赋值给根元素的font-size;

这里的除数选择多少都可以,不一定是要10,这里除10的目的在于:假设设备是iphone6,那宽度就是375,最后得到根元素的font-size就是37.5px,如果除数越大的话，那最后得到的像素就越小也就是font-size越小，而对于浏览器来说，它无法识别那么小的font-size。所以这里的除数，应该选择一个合适的数值。

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

4.得到的htmlDom(根元素)是37.5px 也就是1rem ，接下来就好办多了,当你编码的时候，你就可以依据设计稿中标注的尺寸(px) 例如:你设置某个元素的高度,假设是120px (移动端中设计稿标注的尺寸一般都是乘以2倍)，所以这里要除2,也就是60px，然后用

60px / 根元素的font-size 37.5px = ?rem (这里的问号即是除完后的数值,单位是rem)