同：em和rem都是相对单位。
异：em是相对于父元素，而rem是相对于根(html)元素。
浏览器默认为16px；
将body设为62.5%；
1rem=16px*62.5%-10px;
<html>
<div>
<p> 你猜我字体是多大？</p>
</div>
</html>
/******css样式*********/
html{
font-size:62.5% // font-size:10px 1em:10px
}
div{
font-size:1.2em //font-size: 10 *1.2 =12px
}
p{
font-size:1.2em //font-size= 12*1.2=14.4px
}
1 若没有在根元素（html字体）指定参照值，那浏览器默认1 rem就是16px,若指定值，则1rem就是指定值
2 html设置为62.5%或者10px时会失效，是因为 小于12px或者75%的字体大小 不支持换算。这可能与有些浏览器不支持12px以下的大小有关。所以，使用rem单位，html的字体默认字体大小必须设置为12px或以上。若小于12px则浏览器换算时自动默认字体为12px。
原文：https://www.cnblogs.com/mm152534/p/9430183.html