logo标签列表

CSS中的'font-size: medium'是设置字体大小为正文字体大小还是*浏览器*的基础字体大小？

css
4
在《CSS：缺失的手册》中，作者说font-size：medium（或其他大小关键字）将字体设置为相对于浏览器基础字体大小。
但是我在FF2和IE6中看到的是它将字体大小设置为.CSS HTML或BODY样式中指定的大小（这更受欢迎）。
如果它以后一种方式工作，那么如果您有嵌套样式并且知道您希望某些文本成为正文字体大小（即“正常大小的文本”），则非常方便。
5个回答
5

来自CSS 2.1规范：

'medium'值是用户首选的字体大小，用作参考中间值。

如果浏览器没有执行此操作，则浏览器存在错误。

2

它将基于父元素，以尊重级联。如果有帮助的话，我总是用这种方式设置字体大小：

body {
   font: normal 100% "Arial","Helvetica",sans-serif;
}
p, li, td {
   font-size: .85em;
}
li p, td p {
   font-size: 1em;
}

将正文设置为100％，然后对其他所有内容使用em。我从不使用“smaller”或“medium”等任何东西。这样我就有更多的控制。

编辑：

请查看Jim关于“medium”是绝对字体大小的评论。值得注意。

大小关键词是绝对的。它们不像您使用的相对大小那样工作。 - Jim
1

如前所述，medium是由UA（浏览器）设置的，但您仍可以通过使用rem来获得所需的行为。 rem相对于根元素（特别是<html>元素，而不是<body>），因此受根元素的样式影响。

请参见这个演示。

html
{
  font-size: 60px;
}

#mediumBlock
{
  font-size: medium;
}

#remBlock
{
  font-size: 1rem;
}

#halfRemBlock
{
  font-size: 0.5rem;
}
<div id="inheritedBlock">
  Foobar inherited
</div>
<div id="mediumBlock">
  Foobar medium
</div>
<div id="remBlock">
  Foobar rem
</div>
<div id="halfRemBlock">
  Foobar 0.5rem
</div>

0

字体大小关键词（xx-small、x-small、small、medium等）基于用户默认的中等字体大小。它也可以用于相对于父元素更改子元素的大小。

-1

我认为如果您将元素（如容器或正文）的默认大小设置为一个值，则子元素中的任何相对字号都是基于父元素的。 只有当您没有在任何地方指定字号时，它才会默认为浏览器（它们的大小各不相同）。

"medium" 是绝对字体大小，而不是相对大小。 - Jim
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接