rem基本介绍

rem全称font size of the root element，是一种相关参考坐标，即在根结点设置基本的字体大小（一般是根html），其他节点的所有的字体大小都是相对于根结点（html）而已。

示例

随着屏幕的宽高的变化，动态设置html节点的fontSize属性. width属性根据设计图的尺寸做相应的调整。 通过如下的方式，可以直接通过将设计图上的px值除以100即为当前的设置的元素属性值。

window.addEventListener("resize", this.setFontSize);function setFontSize() {    var designedWidth = this.props.width;    let actualWidth = Math.min(450, $(window).width());    document.documentElement.style.fontSize = actualWidth * 100 / designedWidth + 'px';}

其他

如果设计图的属性固定，不常变化，可以直接将如下代码设置在html中

(function (doc, win) {      var docEl = doc.documentElement,        resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',        recalc = function () {          var clientWidth = docEl.clientWidth;          if (!clientWidth) return;          clientWidth = clientWidth>750?750:clientWidth;          docEl.style.fontSize = Math.floor (100 * (clientWidth / 750)) + 'px';        };      if (!doc.addEventListener) return;      win.addEventListener(resizeEvt, recalc, false);      doc.addEventListener('DOMContentLoaded', recalc, false);    })(document, window);