解决移动设备的字体被放大，导致页面排版错乱

在开发移动端页面的时候，之前一直没有测出这个问题。直到某天，在领导的手机上出现了排版错位的问题，拿着手机质问我的工作态度。
百度了一下发现，原来浏览器调整了字体大小，会放大网页的字体，从而导致排版混乱。通过设置可以禁止网页字体被放大：

禁止微信端字体放大（JavaScript脚本）：

(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 });
        });
    }
})();

禁止浏览器字体放大（CSS样式）：

body {
    -webkit-text-size-adjust: 100%!important;
    -ms-text-size-adjust: 100%!important;
    -moz-text-size-adjust: 100%!important;
    text-size-adjust: 100%!important;
}

text-size-adjust 用来控制一些移动设备上的文本溢出算法。

不过，根据 MDN 网站的介绍，text-size-adjust 还是实验中的功能，不是所有的浏览器都会生效。