微信放大字體導致頁面樣式布局全亂

微信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--- -->