px,em,rem

Posted 2020-09-01 zhangzhongjiang

1. px

1个px相当于1个像素，px是固定的，不会随着页面改变而改变。

2. em

em是相对的长度单位。

（1）em相对参照物为父元素的font-size。

（2）em具有继承的特点。

（3）当没有设置font-size时，浏览器会有一个默认的em设置：1em=16px。

缺点：

em是依赖于父元素字体大小，而各父元素的尺寸不一定是一样的，所以会带来布局上的不确定性。

3. rem

rem的相对参照物为根元素html，相对参照固定不变，所以比较好计算。

当没有设置font-size时，浏览器会有一个默认的rem设置： 1rem=16px，这点与em是一致的。