rem布局定位

• 首先引入这段原生js： 大概意思就是： 如果页面宽度超过了750px. 那么页面中html的font-size恒为100px; 否则，页面中html的font-size的大小为： 100*(当前页面的宽度/750)

(function (doc, win) {
    var docEl = doc.documentElement,
        resizeEvt = 'onorientationchange' in window ? 'onorientationchange' : 'resize',
        recalc = function () {
        var clientWidth = docEl.clientWidth;
        if (!clientWidth) return;
        if(clientWidth>=750){
            docEl.style.fontSize = '100px';
        }else{
            docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';
        }
    };
    if (!doc.addEventListener) return;
    win.addEventListener(resizeEvt, recalc, false);
    doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);

• 为什么是750px？ -- 对于手机屏幕，750px的页面宽度是一个安全的最大宽度，保证了移动孤单页面两边不留白，注意这里的px是css逻辑像素，与设备的物理像素是有区别的，（如iphone5使用的是Retina视网膜屏幕，使用2px*2px的device pixel 代表1px*1px的css pixel，所以设备像素数为750*1136px,而它的css逻辑像素为375*568px.）如果要切移动端页面，你可以先把效果图宽度等比缩放到750px.
• 为什么设置html的font-size? -- rem就是根元素的字体大小。html 中的所有标签样式凡是涉及到尺寸的，都可以用rem作为单位。

• 如果你把html的font-size设为20px;前面说过rem就是html的字体大小，那么1rem = 20px.