(2019)[前端]面试题[5]：CSS单位那些事【px,em,rem】

问题

说一下你了解的CSS的单位？

Hello，欢迎来到我的博客，每天一道面试题，我们共同进步。

解答

首先CSS长度单位分为【绝对长度单位】和【相对长度单位】

绝对长度单位

• in 英寸
• cm 厘米
• mm 毫米
• pt
• pc

结论： 绝对长度单位表示为一个固定的值，不会改变。不利于页面渲染。所以很少人用。

相对长度单位

px

PX即像素，而像素是相对显示器屏幕分辨率而言的。

em

• em的值并不固定
• em继承父级元素的字体大小
• 任意浏览器的默认字体高都是16px

rem

• rem是CSS3中新增的单位，并且 相对的元素是html根元素（html），默认也是16px
• 通过它既可以做到只修改根元素就 成比例的调整所有字体大小，又可以避免字体大小逐层复合的连锁反应
• 区别em是根据父元素继承相应大小而不是固定的，rem是继承html根元素的大小
• 只有改变根元素html的值才能改变rem的值