em和rem

1. rem是跟据html元素的字体大小计算
2. em根据当前字体的大小进行计算

终极案例

1. 经常比较的是em和rem
2. 但是我常常弄混的是em和百分比

.parent {
  height: 300px;
}
.son {
  font-size: 20px;
  width: 2em; /*基于font-size,结果是40px*/
  height: 20%; /*基于父元素的height,结果是60px*/
}