Question

我的HTML看起来像这样：

body {
font-size: 75%;
font-family: Verdana, Arial, Helvetica, sans-serif;
}

我的CSS看起来像这样：

header .logo {
    text-align:center;
    line-height: 6rem;
    font-size: 4rem;
    font-weight: bold;
    font-family: "Segoe UI Web Light", "Segoe UI Light", "Segoe UI Web Regular", "Segoe UI", "Segoe UI Symbol", "Helvetica Neue", Arial;
}

当我指定行高为6rem时，它在Chrome开发人员工具中显示为96px。任何人都可以告诉我在rem中设置忽略正文字体大小设置吗？

我的目标是IE9及以上版本，所以现在使用rem是一个好主意还是我应该等一年才能使用rem进行未来的设计？

Answer 1

由于根元素不是body，因此它是html。由于您实际上没有修改根元素的字体大小，因此1 rem仍然等于默认字体大小16px，因此6 rems是96px。

要纠正这一点，您只需更改选择器：

html {
font-size: 75%;
font-family: Verdana, Arial, Helvetica, sans-serif;
}

现在6 rems应正确计算为72px（16xx的75％的6倍）。

如果我的身体字体大小在我的CSS中为75％，为什么6rem DIV大小等于96px

1 个答案: