移動端網字型rem設定
阿新 • • 發佈:2018-12-23
<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; } 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; wFsize = wFsize > 32 ? wFsize : 32; window.screenWidth_ = wWidth; if(isYIXIN || is2345 || ishaosou || isSogou || isLiebao || isGnbr){//YIXIN 和 2345 這裡有個剛呼叫系統瀏覽器時候的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'; document.getElementById("fixed").style.display="none"; } // alert("fz="+wFsize+";dpr="+window.devicePixelRatio+";UA="+uAgent+";width="+wWidth+";sw="+screen.width+";wiw="+window.innerWidth+";wsw="+window.screen.width+window.screen.availWidth); } resizeRoot(); </script>
body {
font-size: 32px;
font-size: .32rem;
max-width: 1080px;
margin: 0 auto;
background: #f6f6f6;
font-family: 'STHeiti','Microsoft YaHei',Helvetica,Arial,sans-serif;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.m_article .m_article_info .m_article_title { font-size: .34rem; margin-bottom: .2rem; color: #404040; line-height: .42rem; width: 100%; display: inline-block; }
通用:
html {
font-size: 62.5%;
}
body {
font-family: Arial,Roboto,"Droid Sans",Helvetica,"Helvetica Neue","Microsoft Yahei",sans-serif;
color: #333333;
font-size: 1.5rem;
line-height: 1;
}
function AutoWidth(){ var winWidth,winHeight; if (window.innerWidth){ winWidth = window.innerWidth; }else if ((document.body) && (document.body.clientWidth)){ winWidth = document.body.clientWidth; } if (window.innerHeight){ winHeight = window.innerHeight; }else if ((document.body) && (document.body.clientHeight)){ winHeight = document.body.clientHeight; } // 通過深入 Document 內部對 body 進行檢測,獲取視窗大小 if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth){ winHeight = document.documentElement.clientHeight; winWidth = document.documentElement.clientWidth; } var s = 100; if(winHeight > winWidth){ s = 100 / 750 * winWidth; s = s >200 ? 200 : s; } $('html').css('font-size',s); }