移動端初設定(使用rem作為單位)
阿新 • • 發佈:2018-12-23
頭部設定,計算畫素比pixelRatio並且還原畫素比。計算出fontSize,根據當前fontSize得出rem,製作移動端頁面。
<script type="text/javascript">
function setS(){var pixelRatio = 1 / window.devicePixelRatio;
document.write('<meta name="viewport" content="width=device-width,initial-scale='+pixelRatio+',minimum-scale='+pixelRatio+',maximum-scale='+pixelRatio+'" />');
var htm l= document.getElementsByTagName('html')[0];
var clientWidth = html.getBoundingClientRect().width;
html.style.fontSize = clientWidth / 16 + 'px';
//求出當前html的font-size=40px,利用font-size,計算在640px時候li的寬度
//由於每個li寬300px 轉換為rem單位的就是 300/40
}
setS();
window.onresize = function (){
setS();
location.reload();
}
</script>