移动端适配方案之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

适配屏幕的main.js代码

假设原型图的大小是iPhone6p : 414*736，默认字体大小是16px;

然后在全局html中引入这段js，就可以了，就这么简单，移动端就实现了自适应（当然这是在借助插件的帮你转换了rem的基础上完成的操作）；

适配原理：
根据不同屏幕的宽度，以相同的比例动态修改html的font-size适配，并将px替换成rem，它可以很好的根据根元素的字体大小来进行变化，从而达到各种屏幕基本一直的效果体验

百分比方案

适配原理
使用 百分比% 定义 宽度，高度 用px固定&