rem与em

rem是相对于根元素的字体大小。
eg：根元素的字体大小 16px，10rem 将等同于 160px，即 10 x 16 = 160。

html {
font-size: 16px;
padding: 10rem; // 160px
}

em: 使用em单位的元素的字体大小
eg:如果一个 div 有 18px 字体大小，10em 将等同于 180px，即 10 × 18 = 180

div{
font-size: 18px;
padding: 10em; // 180px
}

在移动端的web页中，使用rem的多。
我用的rem的配置（相当于750px的屏幕宽度，即我把根元素字体设置为100px，比如UI给的图某个宽度为200px，就可设置为2rem。）：

    setRem();
    window.addEventListener('orientationchange', setRem);
    window.addEventListener('resize', setRem);
    function setRem() {
      var html = document.querySelector('html');
      var width = html.getBoundingClientRect().width;
      html.style.fontSize = width / 7.5 + 'px';
    }

贴个链接何时使用rem与em