rem布局

//屏幕适应
(function (win, doc) {
    if (!win.addEventListener) return;
    var html = document.documentElement;

    function setFont() {
        var html = document.documentElement;
        var k = 750; //设计稿大小
        html.style.fontSize = html.clientWidth / k * 100 + "px";
    }
    setFont();
    doc.addEventListener('DOMContentLoaded', setFont, false);
    win.addEventListener('resize', setFont, false);
    win.addEventListener('load', setFont, false);
})(window, document);

• 如何根据设计稿大小，用rem实现布局，很简单，只需要把上面的代码k的值，修改你的设计稿大小就可以了：

  var k = 750; //设计稿大小

假如说，此时你的设计稿大小是750px宽，页面有一个元素的大小是350px，换算成rem来写的话，那它的宽度就是实际宽度，再除以100也就是3.5rem,其他元素雷同，如此就可以轻松写我们的移动端页面了。