css中单位px和em，rem的区别

最新推荐文章于 2025-01-14 16:29:06 发布

原创最新推荐文章于 2025-01-14 16:29:06 发布 · 548 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端

前端专栏专栏收录该内容

6 篇文章

订阅专栏

本文深入解析px、em与rem三种CSS长度单位，重点讲解rem的相对特性及其在响应式设计中的优势，以及如何利用rem实现全局字体大小的灵活调整。

1、px是相对长度单位，它是相对于显示器屏幕分辨率而言的。
优缺点：比较稳定和精确，但在浏览器中放大或缩放浏览页面时会出现页面混乱的情况。
2、em是相对长度单位，em是相对于父元素来设计字体大小的。如果当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
优缺点：em的值并不是固定的，它会继承父级元素的字体大小。
3、rem是CSS3新增的一个相对单位，rem是相对单位，是相对HTML根元素。
优点：它可以做到只修改根元素就成比例地调整所有字体大小。