美文网首页
react移动端自适应用rem

react移动端自适应用rem

作者: 四哥_d0ad | 来源:发表于2018-11-14 20:55 被阅读0次

1.在系统唯一html文档中写入方法如下:

function resetWidth() {

          // 兼容ie浏览器 document.body.clientWidth

          var baseWidth = document.documentElement.clientWidth || document.body.clientWidth;

          console.log(baseWidth);

          // 默认的设置是375px(ip6)的根元素设为100px, 其他的手机都相对这个进行调整

          document.documentElement.style.fontSize = baseWidth / 375 * 100 + 'px'

      }

      resetWidth();

      window.addEventListener('resize', function () {

          resetWidth();

      })     

2.然后在style样式文件中的globle.less文件中写入样式:

html:{font-size:100px} body{font-size:16px}

相关文章

网友评论

      本文标题:react移动端自适应用rem

      本文链接:https://www.haomeiwen.com/subject/owdsfqtx.html