H5页面自适应——rem

rem.js

/* rem.js文件内容 */
(function() {
  var html = document.documentElement;

  function onWindowResize() {
    html.style.fontSize = html.getBoundingClientRect().width / 20 + 'px';
  }

  window.addEventListener('resize', onWindowResize);
  onWindowResize();
})();

需要注意的是在html文件的head标签中需要加入一行：

<meta name="viewport" content="initial-scale=1.0,width=device-width">

指定页面宽度为设备宽度。