布局之rem

１．利用媒体查询：
　　首先，设置html里的font-size属性。值为62.5%，62.5%=10/16，默认的基数就为10，想要的px值/10（默认基数）就是rem；如果值设为100%，100%=16/16，基数就为16，不方便px换算rem。在代码注释里有详细的解释和计算公式。

html{font-size:62.5%;}   /*基数设为10.   62.5%=10/16 基数为10  基数为什么设为10，后面的字体大小需要px/基数，基数为10方便计算
							百分数=基数/16    100%=16/16  基数为16
							px换算rem   公式=想要的px值/基数   基数为10方便计算
						 */

所以，我推荐使用基数为10，设置html里的font-size属性值为62.5%即可，之后将页面里的px除以10（如果想要25px，换成rem，25px/10（默认基数）=2.5rem）。高度使用rem，宽度使用rem和百分比。
　　然后在媒体查询的几个css中，采用不同的rem来设置大小。
2．js动态计算赋值：

//js获取viewport来进行根元素字体大小的计算
<script type="text/javascript">
    (function (doc, win) {
        var docEl = doc.documentElement,
        resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
        recalc = function (){
            var clientWidth = docEl.clientWidth;
            if (!clientWidth) return;
                if(clientWidth>=640){//640是以phone5s的分辨率,可以自行修改
                    docEl.style.fontSize = '100px';
                }else{
                    docEl.style.fontSize = 100 * (clientWidth / 640) + 'px';//同上
                }
        };
        if(!doc.addEventListener) return;
        win.addEventListener(resizeEvt, recalc, false);
        doc.addEventListener('DOMContentLoaded', recalc, false);
    })(document, window);
</script>