各个单位的定义及兼容性

• vw, vh:
• px
• em
• rem

rem适配

function reset() {
    var design = 750;
    var dpr, rootFontSize, scale;
    var docEl = document.documentElement;
    var metaEl = document.querySelector('meta[name="viewport"]');

    dpr = window.devicePixelRatio || 1;
    scale = 1 / dpr;
    rootFontSize = docEl.clientWidth * dpr * 100 / design;

    metaEl.setAttribute('content', 'width=' +  docEl.clientWidth + ',initial-scale=' + scale + ',maximum-scale=' + scale + ', minimum-scale=' + scale + ',user-scalable=no');

    document.getElementsByTagName('html')[0].style.fontSize= rootFontSize + 'px';
}

reset();

//判断手机横竖屏状态：
window.addEventListener("onorientationchange", function() {
    reset();
    if (window.orientation === 180 || window.orientation === 0) { 
      // alert('竖屏状态！');
    } 
    if (window.orientation === 90 || window.orientation === -90 ){ 
      // alert('横屏状态！');
    } 
}, false);

window.addEventListener("resize", function() {
  location.reload();
}, false); 

常用第三方库及使用