根据设备分辨率设置根元素的fontSize，从而设置rem。
<script>
//屏幕适应
(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
docEl.style.fontSize = 100 * (clientWidth / 640) + 'px';
};
if (!doc.addEventListener) return;
recalc();
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
</script>
移动web开发
- 运行在手机端的web页面（H5页面）
- 跨平台
- 基于webview
- 告别
IE拥抱webkit - 更高的适配性和性能要求
常见的移动web适配方法
rem原理与简介
rem,font size of the root element
字体单位
- 值根据html根元素的font-size大小而定，同样可以作为宽度，高度等单位
适配原理
- 将px替换成rem，动态修改html的font-size适配
兼容性
- Ios6以上和android 2.1以上，基本覆盖所有流行的手机系统
rem进阶
- rem基准值的计算
- rem数值计算与构建
- rem与scss结合使用
- rem适配实战
