vue项目使用rem(pc和移动通用)

new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>',
  mounted() {
  	setRem();
  }
})

// rem适配
function setRem() {
  var whdef = 100/1920;// 表示1920的设计图,使用100PX的默认值
  var bodyWidth = document.body.clientWidth;// 当前窗口的宽度
  var rem = bodyWidth * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
  document.getElementsByTagName('html')[0].style.fontSize = rem + 'px';
}
window.addEventListener('load', setRem);
window.addEventListener('resize', setRem);

 

Logo

Vue社区为您提供最前沿的新闻资讯和知识内容

更多推荐