logo标签列表

CSS中rem和em有什么区别？

css
143

在网站源代码中，我有时看到开发人员使用rem单位。它是否类似于em？我尝试了一下以查看它实际上的作用，但是相对于什么呢？

演示

HTML

<div>Hello <p>World</p></div>

CSS

div {
    font-size: 1.4rem;
}

div p {
    font-size: 1.4rem;
}
12个回答
0
主要问题出现在使用“em”和“rem”时存在父级字体大小的情况下... 以下是一个例子： 假设我想要网站正文的字体大小为2em，因此我们在正文中包含2em字体大小，这被称为父级字体大小... 然后，对于我的H1，我想要一个5.6左右的大小，保存并返回到我们的网站并刷新后，我们会注意到我们的H1现在已经超过了5.6。 这是因为字体被继承并添加到其从父级获取的任何内容之上...（当我们使用em和百分比时，这些问题将发生） 因此，为了摆脱这种问题，程序员使用rem。
0

EM相对于其直接或最近的父元素的字体大小，而REM只相对于html（根）字体大小。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接