REM适配

一. rem适配原理 :
rem是相对长度单位，可以做到一样的取值，在不同尺寸的屏幕上的大小按比例缩放。
**rem的定义：**rem（font size of the root element）是相对于根元素（即html元素）font-size计算值的倍数。
例如html标签设置font-size:16px，同时div设置width:1.2rem。那么这个div的宽度就是1.2rem=16px*1.2=19.2px。
因此这种方法的适配原理是：根据不同屏幕的宽度，以相同的比例动态修改html的font-size适配，并将px替换成rem，它可以很好的根据根元素的字体大小来进行变化，从而达到各种屏幕基本一直的效果体验。
二. 控制适配屏幕 :

//JS代码
//获得屏幕大小
let htmlwidth = document.documentElement.clientWidth || document.body.clientWidth;  //浏览器兼容
console.log("屏幕宽度："+htmlwidth) //iphone5:320 iphone6:375

//获得html DOM元素
let htmlDom = document.getElementsByTagName('html')[0];

//给DOM元素设置样式
htmlDom.style.fontSize = htmlwidth/10.8 + 'px';  

//JQ代码
//给document的fontSize设置动态设置字体
document.documentElement.style.fontSize = document.documentElement.clientWidth / 10.8 + 'px';

二. 设计图的设置（像素大厨） :
fontSize = clientWidth / 10.8，假如设计图的分辨率为1080 * 2244，则，fontSize = 1080 / 10.8，因此，基数应设置为100。

转载于:https://my.oschina.net/winchell/blog/3060821