解决rem页面在微信浏览器中样式错乱问题
问题原因:微信字体设置不是标准大小,
解决方法:禁止微信调整字体大小即可
安卓系统处理方法:
function handleFontSize() {
// 设置网页字体为默认大小
WeixinJSBridge.invoke("setFontSizeCallback", {
"fontSize": 0
})
// 重写设置网页字体大小的事件
WeixinJSBridge.on("menu:setfont", function() {
WeixinJSBridge.invoke("setFontSizeCallback", {
"fontSize": 0
})
})
}
(function() {
if(typeof WeixinJSBridge == "object" && "WeixinJSBridge.invoke == "function"){
handleFontSize();
} else {
if (document.addEventListener) {
document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
} else if(document.attachEvent) {
document.attachEvent("WeixinJSBridgeReady", handleFontSize);
document.attachEvent("onWeixinJSBridgeReady", handleFontSize);
}
}
})()
IOS处理方法
body {
-webkit-text-size-adjust: 100% !important;
}
感谢这位知乎大佬文章:https://zhuanlan.zhihu.com/p/443319104