PC端自适应方案

步骤一：定义自适应方法(放在需要的页面，如果是vue可放在app.vue中)

//首次加载
this.resizeWeb();

//监听窗口缩放(应尽量避免不停缩放)
window.addEventListener('resize',()=>{
  this.resizeWeb();
})

resizeWeb(){
  var wH = window.innerHeight; // 当前窗口的高度
  var wW = window.innerWidth; // 当前窗口的宽度
  var whdef = 100 / 1920; // 表示1920的设计图,使用100PX的默认值
  var rem = wW * whdef; // 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
  if(wW>920){
    var html = document.documentElement;
    html.style.fontSize = rem + "px"; //适用于PC网站
  };
}

步骤二：定义scss函数（放在scss文件中）

$browser-default-font-size:100px!default;
html,body{
    font-size:$browser-default-font-size;
}
@function px2rem($px){
    @return $px/$browser-default-font-size*1rem;
}

使用方式：

<div class="dv"></div>

<style>
	.dv{
    	width:px2rem(200px);
        height:px2rem(100px);
    }
</style>

<script>
	resizeWeb();
    window.addEventListener('resize',()=>{
      resizeWeb();
    });
    
    function resizeWeb(){
    	var wH = window.innerHeight; // 当前窗口的高度
        var wW = window.innerWidth; // 当前窗口的宽度
        var whdef = 100 / 1920; // 表示1920的设计图,使用100PX的默认值
        var rem = wW * whdef; // 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
        if(wW>920){
          var html = document.documentElement;
          html.style.fontSize = rem + "px"; //适用于PC网站
        };
  	};
</script>