Rem与em的简单理解

Rem与em的简单理解

Em单位与像素px的转换

所得的像素值 = 当前元素的font-size * em的值

比如：div的font-size：12px 10em等同于120px 12*10 =120

Rem单位如何转换为像素值

所得像素值 = 根元素html font-size（默认是16px）*rem值

例如：根元素字体大小16px，10rem等同于160px，16*10 = 160

使用场景

使用em单位适用于在非默认字体大小的元素上的padding，margin，width，height，line-height等值。不建议使用em来控制大小，一般使用rem单位的字体大小，使用rem单位创建统一可扩展的设计，媒体查询也应该是rem单位。