页面适配的rem换算

假设咱们规定一个标准，设计图中apx对应页面上1rem，也就是对于设备上的基准fontSize=bpx,固然这个bpx是根据具体设备而变的 

bpx = apx * 实际设备分辨率 / 设计图分辨率,这个关系是固定的，因此咱们能够在js先计算出这个设备的基准fontSize=bpx

而后在css中设置元素的xrem长度是怎么计算的呢,假设设计图中这个元素的长度ylpx

ypx / apx = xrem / 1rem

xrem = ypx / apx * 1rem

        = ypx / apx 

 

代码以下：

!function(w){
    var d = w.document,
        de = d.documentElement,
        re = 'orientationchange' in w ? 'orientationchange' : 'resize',
        recalc = function () {
            var re = d.body.clientWidth || d.documentElement.cw;
            if ( !re ) return;
            var fs = parseFloat(100 * re / 1180 );
            de.style.fontSize = fs + "px";
        }
if ( !d.addEventListener ) retrun;
w.addEventListener(re, recalc, false);
d.addEventListener('DOMContentLoaded', recalc, false);}(window)