移動端設置 font-size

網(wǎng)易方案

設計稿尺寸為750汛聚,設置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 這里有個剛調(diào)用系統(tǒng)瀏覽器時候的bug,需要一點延遲來獲取
                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>
最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末短荐,一起剝皮案震驚了整個濱河市倚舀,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌忍宋,老刑警劉巖痕貌,帶你破解...
    沈念sama閱讀 217,657評論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異糠排,居然都是意外死亡舵稠,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,889評論 3 394
  • 文/潘曉璐 我一進店門乳讥,熙熙樓的掌柜王于貴愁眉苦臉地迎上來柱查,“玉大人,你說我怎么就攤上這事云石。” “怎么了研乒?”我有些...
    開封第一講書人閱讀 164,057評論 0 354
  • 文/不壞的土叔 我叫張陵汹忠,是天一觀的道長。 經(jīng)常有香客問我雹熬,道長宽菜,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,509評論 1 293
  • 正文 為了忘掉前任竿报,我火速辦了婚禮铅乡,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘烈菌。我一直安慰自己阵幸,他們只是感情好,可當我...
    茶點故事閱讀 67,562評論 6 392
  • 文/花漫 我一把揭開白布芽世。 她就那樣靜靜地躺著挚赊,像睡著了一般。 火紅的嫁衣襯著肌膚如雪济瓢。 梳的紋絲不亂的頭發(fā)上荠割,一...
    開封第一講書人閱讀 51,443評論 1 302
  • 那天,我揣著相機與錄音旺矾,去河邊找鬼蔑鹦。 笑死夺克,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的嚎朽。 我是一名探鬼主播懊直,決...
    沈念sama閱讀 40,251評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼火鼻!你這毒婦竟也來了室囊?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,129評論 0 276
  • 序言:老撾萬榮一對情侶失蹤魁索,失蹤者是張志新(化名)和其女友劉穎融撞,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體粗蔚,經(jīng)...
    沈念sama閱讀 45,561評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡尝偎,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,779評論 3 335
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了鹏控。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片致扯。...
    茶點故事閱讀 39,902評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖当辐,靈堂內(nèi)的尸體忽然破棺而出抖僵,到底是詐尸還是另有隱情,我是刑警寧澤缘揪,帶...
    沈念sama閱讀 35,621評論 5 345
  • 正文 年R本政府宣布耍群,位于F島的核電站,受9級特大地震影響找筝,放射性物質(zhì)發(fā)生泄漏蹈垢。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,220評論 3 328
  • 文/蒙蒙 一袖裕、第九天 我趴在偏房一處隱蔽的房頂上張望曹抬。 院中可真熱鬧,春花似錦急鳄、人聲如沸谤民。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,838評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽赖临。三九已至,卻和暖如春灾锯,著一層夾襖步出監(jiān)牢的瞬間兢榨,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,971評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留吵聪,地道東北人凌那。 一個月前我還...
    沈念sama閱讀 48,025評論 2 370
  • 正文 我出身青樓,卻偏偏與公主長得像吟逝,于是被迫代替她去往敵國和親帽蝶。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 44,843評論 2 354

推薦閱讀更多精彩內(nèi)容

  • 偶然間發(fā)現(xiàn)這篇文章块攒,可以說励稳,這是我見到的對移動rem單位做的最詳細,最細心的一篇總結(jié)性文章囱井,果斷轉(zhuǎn)載至本博客驹尼,以便...
    阿寶er閱讀 1,158評論 5 51
  • 1、困擾多時的問題 在這之前做Web App開發(fā)的的時候庞呕,在自適應方面一般都是寬度通過百分比新翎,高度以iPhone6...
    阿根廷斗牛閱讀 1,249評論 0 3
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,751評論 1 92
  • 在移動互聯(lián)網(wǎng)快速發(fā)展的今天住练,手機的種類和尺寸越來越多地啰,作為前端的小伙伴們可能會越來越頭疼,但又不得不去適配一款又一...
    keenjaan閱讀 26,821評論 9 86
  • 墓基之地讲逛,天神鏡鴻一族亏吝。鏡鴻之首——鄭沛君膝下一子一女,喚名崇晏妆绞、瑤聲顺呕。景年三月,天神子女不倫之戀括饶,誕下一女,喚名...
    Cayla小仙女閱讀 271評論 0 1