html移动端 -- meta-模板 + rem

第一种方式： ps 不用除以2
<header>
 <meta charset="utf-8">

  <meta name="viewport" content="target-densitydpi=device-dpi, width=720, user-scalable=no">
  <meta name="viewport-fit" content="cover">
  <!-- IOS 中 Safari 允许全屏浏览 -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <!-- uc强制竖屏 -->
  <meta name="screen-orientation" content="portrait">
  <!-- QQ强制竖屏 -->
  <meta name="x5-orientation" content="portrait">
  <!-- format-detection 禁用自动识别页面中的电话号码。 -->
  <meta name="format-detection" content="telephone=no" />
</header>

第二种方式：用rem   ps 除以2

// rem

(function(doc, win) {

      var docEle = doc.documentElement,

        evt = "orientationchange" in window ? "orientationchange" : "resize",

        fn = function() {

          var width = docEle.clientWidth;

　　　　　  width > 750 && width = 750;

          width && (docEle.style.fontSize = 100 * (width / 750) + "px");

        }

      win.addEventListener(evt, fn , false);

      doc.addEventListener("DOMContentLoaded", fn, false)

    }(document, window))

 

 

 

 

    !function (n){
      var e = n.document,
          t = e.documentElement,
          i = 375,
          d = i/100,
          o = "orientationchange" in n ? "orientationchange" : "resize",
          a = function() {
            var n = t.clientWidth || 375;
            n > 750 && (n = 750);
            t.style.fontSize = n/d + "px"
          };
          e.removeEventListener && (n.removeEventListener(o,a), e.removeEventListener('DOMContentLoaded',a));
          e.addEventListener && (n.addEventListener(o,a,!1),e.addEventListener("DOMContentLoaded",a,!1))
    }(window)