vue移动端适配就这么玩 

rem 布局
在主入口：index.html，<head> 标签内添加如下JS 代码：（实现在标准 375px宽度适配下，100px = 1rem。）

  <script>
    (function () {
      // 在标准 375px 适配下，100px = 1rem;
      var baseFontSize = 100;  
      var baseWidth = 375;

      var set = function () {
        var clientWidth = document.documentElement.clientWidth || window.innerWidth;

        var rem = 100;
        if (clientWidth != baseWidth) {
          rem = Math.floor(clientWidth / baseWidth * baseFontSize);
        }

        document.querySelector('html').style.fontSize = rem + 'px';
      }
      set();

      window.addEventListener('resize', set);
    }());   
  </script>
posted @ 2020-06-21 16:43  FE-神鸟  阅读(158)  评论(0)  编辑  收藏  举报