移動(dòng)端設(shè)置 font-size

網(wǎng)易方案

設(shè)計(jì)稿尺寸為750,設(shè)置font-size為:50px

  <script type="text/javascript">
        var Dpr = 1,
            uAgent = window.navigator.userAgent;
        var isIOS = uAgent.match(/iphone/i);
        var isYIXIN = uAgent.match(/yixin/i);
        var is2345 = uAgent.match(/Mb2345/i);
        var ishaosou = uAgent.match(/mso_app/i);
        var isSogou = uAgent.match(/sogoumobilebrowser/ig);
        var isLiebao = uAgent.match(/liebaofast/i);
        var isGnbr = uAgent.match(/GNBR/i);
        function resizeRoot() {
            var wWidth = (screen.width > 0) ? (window.innerWidth >= screen.width || window.innerWidth == 0) ? screen.width :
                            window.innerWidth : window.innerWidth,
                    wDpr, wFsize;
            var wHeight = (screen.height > 0) ? (window.innerHeight >= screen.height || window.innerHeight == 0) ?
                    screen.height : window.innerHeight : window.innerHeight;
            if (window.devicePixelRatio) {
                wDpr = window.devicePixelRatio;
                console.log(wDpr)
            } else {
                wDpr = isIOS ? wWidth > 818 ? 3 : wWidth > 480 ? 2 : 1 : 1;
            }
            if (isIOS) {
                wWidth = screen.width;
                wHeight = screen.height;
            }
            // if(window.orientation==90||window.orientation==-90){
            //     wWidth = wHeight;
            // }else if((window.orientation==180||window.orientation==0)){
            // }
            if (wWidth > wHeight) {
                wWidth = wHeight;
            }
            wFsize = wWidth > 1080 ? 144 : wWidth / 7.5;
            debugger
            wFsize = wFsize > 32 ? wFsize : 32;
            console.log('fsize:'+wFsize)
            window.screenWidth_ = wWidth;
            if (isYIXIN || is2345 || ishaosou || isSogou || isLiebao || isGnbr) { //YIXIN 和 2345 這里有個(gè)剛調(diào)用系統(tǒng)瀏覽器時(shí)候的bug,需要一點(diǎn)延遲來(lái)獲取
                setTimeout(function () {
                    wWidth = (screen.width > 0) ? (window.innerWidth >= screen.width || window.innerWidth == 0) ?
                            screen.width : window.innerWidth : window.innerWidth;
                    wHeight = (screen.height > 0) ? (window.innerHeight >= screen.height || window.innerHeight ==
                    0) ? screen.height : window.innerHeight : window.innerHeight;
                    wFsize = wWidth > 1080 ? 144 : wWidth / 7.5;
                    wFsize = wFsize > 32 ? wFsize : 32;
                    // document.getElementsByTagName('html')[0].dataset.dpr = wDpr;
                    document.getElementsByTagName('html')[0].style.fontSize = wFsize + 'px';
                    document.getElementById("fixed").style.display = "none";
                }, 500);
            } else {
                // document.getElementsByTagName('html')[0].dataset.dpr = wDpr;
                document.getElementsByTagName('html')[0].style.fontSize = wFsize + 'px';
            }
             // alert("fz="+wFsize+";dpr="+window.devicePixelRatio+";UA="+uAgent+";width="+wWidth+";sw="+screen.width+";wiw="+window.innerWidth+";wsw="+window.screen.width+window.screen.availWidth);
        }
        resizeRoot();
        if (location.protocol === "https:") {
            location.href = location.href.replace("https:", "http:")
        }
        window.onresize = function () {
            console.log('resize')
            resizeRoot();
        }
    </script>
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 偶然間發(fā)現(xiàn)這篇文章,可以說(shuō),這是我見(jiàn)到的對(duì)移動(dòng)rem單位做的最詳細(xì),最細(xì)心的一篇總結(jié)性文章,果斷轉(zhuǎn)載至本博客,以便...
    阿寶er閱讀 1,227評(píng)論 5 51
  • 1、困擾多時(shí)的問(wèn)題 在這之前做Web App開(kāi)發(fā)的的時(shí)候,在自適應(yīng)方面一般都是寬度通過(guò)百分比,高度以iPhone6...
    阿根廷斗牛閱讀 1,379評(píng)論 0 3
  • 問(wèn)答題47 /72 常見(jiàn)瀏覽器兼容性問(wèn)題與解決方案? 參考答案 (1)瀏覽器兼容問(wèn)題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,162評(píng)論 1 92
  • 在移動(dòng)互聯(lián)網(wǎng)快速發(fā)展的今天,手機(jī)的種類和尺寸越來(lái)越多,作為前端的小伙伴們可能會(huì)越來(lái)越頭疼,但又不得不去適配一款又一...
    keenjaan閱讀 27,233評(píng)論 9 86
  • 墓基之地,天神鏡鴻一族。鏡鴻之首——鄭沛君膝下一子一女,喚名崇晏、瑤聲。景年三月,天神子女不倫之戀,誕下一女,喚名...
    Cayla小仙女閱讀 417評(píng)論 0 1

友情鏈接更多精彩內(nèi)容