先声明两个变量供下文使用:

//html style font-size
docElementFontSize = document.documentElement.style.fontSize;

//html 最终的 font-size
finalDocElementFontSize = window.getComputedStyle(window.document.documentElement).getPropertyValue("font-size")

rem是根据html的最终font-size进行响应: 1rem === finalDocElementFontSize(重点!) 。对于大部分机型,docElementFontSize和finalDocElementFontSize是相等的,但是有些网页在某些情况机型下打开的话,会得到docElementFontSize和finalDocElementFontSize不相等的情况。

解决方案

对‘初始实际font-size’和‘最终font-size’进行比对,换算最终font-size放大缩小比值,在换算重置实际font-size。

/*
* 适用于获取屏幕宽度等分设置html的font-size情况,比如 flexible.js库
*/
//计算最终html font-size
function modifileRootRem () {
        var root = window.document.documentElement;
        var fontSize = parseFloat(root.style.fontSize);
        var finalFontSize = parseFloat(window.getComputedStyle(root).getPropertyValue("font-size"));
        if(finalFontSize === fontSize) return;
        root.style.fontSize=fontSize*fontSize/finalFontSize+ "px";
    }