响应式布局

方法一：js动态控制html根节点font-size
请尽早加载一下代码

var evt = "onorientationchange" in window ? "orientationchange" : "resize";
var doc = document.documentElement;
window.addEventListener(evt, _resize, false);
window.addEventListener("DOMContentLoaded", _resize);
function _resize(){
   doc.style.fontSize = 20*(doc.clientWidth / 1200) + "px";  
}//根据ui图纸或自己的需求可自行修改 20,1200 这两个值

方法二 ：css媒体查询

@media screen and (max-width: 1200px){//屏幕宽度小于1200px
  html{
    font-size: 20px;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px){//屏幕宽度1200~1600
  html{
    font-size: 30px;
  }
}
@media screen and (min-width: 1600px){//屏幕宽度大于1600px
  html{
    font-size: 40px;
  }
}