使用淘宝 flexible.js / amfe-flexible.js 的 Rem 解决方案部分手机会出现适配不了问题。网上已经有了解决方案，但很多人并不知道是什么原因导致的。导致此问题的出现主要是用户的手机使用了自定义的字体，导致我们动态设置 html 根元素的 font-size 的值后，与实际的效果 font-size 值不一致。为什么呢？因为某些自定义的字体，假如你设置根元素的 font-size 为 41.4px，但其实这种字体是偏大的，结果其实际在页面上看到的效果可能是 42px。这样就会导致：假如页面屏宽为 414px ，但我们设置页面宽度为的 10rem 为 420px，页面效果就是会偏大，超过一屏 414px 的宽度。
解决思路主要是使用 getComputedStyle 计算出自定义字体实际与我们设置的 font-size 的差异，然后把差异补上就可以了。通用解决方案如下（代码直接引入即可使用）：
(function (window, document) {
/*
* 适用于获取屏幕宽度等分设置 html 的 font-size 情况，比如 flexible.js 库
*/
// 计算最终 html font-size
function modifileRootRem () {
var root = 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' // 【关键代码：差异补上】
}
if (typeof window.onload === 'function') {
var oldFun = window.onload
window.onload = function () {
oldFun()
modifileRootRem()
}
} else {
window.onload = modifileRootRem
}
})(window, document)
参考引用：https://www.jianshu.com/p/7064613bf9f8
