此代碼根據(jù)屏幕尺寸計(jì)算html font-size, 可實(shí)現(xiàn)1px像素border莱预。
當(dāng)頁(yè)面寬度為375px;對(duì)應(yīng)的物理像素為750px;
可直接根據(jù)750px設(shè)計(jì)稿里面的元素尺寸計(jì)算相應(yīng)的rem值（其html font-size為20px）。
建議使用scss定義一個(gè)function谒拴，代碼如下：
@function px2rem($px){
$rem : 16px; // 基于屏幕寬度為750px 的html字體大小凰棉。
@return ($px/$rem) + rem;
}
通用代碼入下：
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!-- 禁止數(shù)字識(shí)別為電話號(hào)碼 -->
<meta name="format-detection" content="telephone=no">
<!-- 忽略郵箱 -->
<meta name="format-detection" content="email=no">
<script>
var viewport = document.querySelector("meta[name=viewport]");
// 以物理像素顯示頁(yè)面元素
var scale = 1/window.devicePixelRatio;
if (window.devicePixelRatio == 1) {
viewport.setAttribute('content', 'width=device-width,initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no');
}else if(window.devicePixelRatio == 2) {
viewport.setAttribute('content', 'width=device-width,initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no');
}else if(window.devicePixelRatio == 3) {
viewport.setAttribute('content', 'width=device-width,initial-scale=0.3333333333333333, maximum-scale=0.3333333333333333, minimum-scale=0.3333333333333333, user-scalable=no');
}else{
viewport.setAttribute('content', 'width=device-width,initial-scale='+scale+', maximum-scale='+scale+', minimum-scale='+scale+', user-scalable=no');
}
var docEl = document.documentElement;
var fontsize = 8 * (docEl.clientWidth / 375) + 'px';
docEl.style.fontSize = fontsize;
window.onresize=function(){
fontsize = 8 * (docEl.clientWidth / 375) + 'px';
docEl.style.fontSize = fontsize;
}
</script>
