微信放大字体导致页面样式布局全乱

微信webview内置了调整字体大小的功能，用户可以根据实际情况进行调节。但是这也会导致字体大小改变以后，出现页面布局错乱的情况。

1、iOS的解决方案是覆盖掉微信的样式：

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

2、安卓手机禁止微信客户端修改字体大小：

 1 <script>
 2        (function() {
 3            if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
 4                handleFontSize();
 5            } else {
 6                if (document.addEventListener) {
 7                    document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
 8                } else if (document.attachEvent) {
 9                    document.attachEvent("WeixinJSBridgeReady", handleFontSize);
10                    document.attachEvent("onWeixinJSBridgeReady", handleFontSize);  }
11            }
12            function handleFontSize() {
13                // 设置网页字体为默认大小
14                WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize' : 0 });
15                // 重写设置网页字体大小的事件
16                WeixinJSBridge.on('menu:setfont', function() {
17                    WeixinJSBridge.invoke('setFontSizeCallback', { 'fontSize' : 0 });
18                });
19            }
20        })();
21 </script>
22 <!-- 强制禁止用户修改微信客户端的字体大小---end--- -->