场景:华为手机微信浏览器中
使用的是 插件: flexible.js
解决方式如下:在flexible的refreshRem
函数中添加利用 getComputedStyle
处理
function refreshRem(){
var width = docEl.getBoundingClientRect().width;
if (width / dpr > 540) {
width = 540 * dpr;
}
var rem = width / 10;
docEl.style.fontSize = rem + 'px';
/* 解决华为P30等机型微信浏览器内rem比例不对问题 start */
var finalFontSize = parseFloat(window
.getComputedStyle(docEl)
.getPropertyValue("font-size"));
var tempCoefficient = rem / finalFontSize;
if (tempCoefficient !== 1) {
var fontSizeCoefficient = tempCoefficient;
docEl.style.fontSize = rem * fontSizeCoefficient + "px";
}
/* end */
flexible.rem = win.rem = rem;
}