禁止微信内置浏览器调整字体大小-优快云博客

本文介绍了解决微信页面中由于用户更改默认字体大小导致页面布局错乱的问题。提供了iOS和Android平台的具体解决方案，通过CSS样式及JavaScript桥接API确保页面布局的一致性和美观性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

原因：

制作微信页面是，用户设置微信默认字体大小，而造成页面布局的不忍直视

解决方案：

iOS：

/* IOS禁止微信调整字体大小 */
body { 
    -webkit-text-size-adjust: 100% !important;
}

Android：

(function () {　　
    if (typeof WeixinJSBridge == "object" && typeof 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);
        }
    }

    function handleFontSize() {
        // 设置网页字体为默认大小
        WeixinJSBridge.invoke('setFontSizeCallback', {
            'fontSize': 0
        });
        // 重写设置网页字体大小的事件
        WeixinJSBridge.on('menu:setfont', function () {
            WeixinJSBridge.invoke('setFontSizeCallback', {
                'fontSize': 0
            });
        });
    }
})();