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
