Courier 字体在 Webkit 浏览器中很小
我注意到在 Chrome 和 Safari 中,我的 Courier 文本很小。在 Internet Explorer 和 Firefox 中,Courier 文本的大小与我的其他文本的大小相当。我的 CSS 有问题吗?
#article pre,
#article code {
display: block;
font-family: courier, monospace;
background: #f7f7f7;
padding: 0.6em;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border: 1px solid #ddd;
margin: 0 0 1em 0;
}
I noticed that in Chrome and Safari, my Courier text is tiny. In Internet Explorer and Firefox, the Courier text is comparable in size to the rest of my text. Is there something wrong with my CSS?
#article pre,
#article code {
display: block;
font-family: courier, monospace;
background: #f7f7f7;
padding: 0.6em;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border: 1px solid #ddd;
margin: 0 0 1em 0;
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
是的,WebKit 对于普通字体和等宽字体有单独的默认字体大小首选项。当您使用从相对字体大小派生的字体大小(即文本的祖先元素都没有绝对字体大小)时,您会得到等宽字体和普通字体的不同大小。
(这不一定是一件坏事,除了较小的等宽字体的默认偏好并不真正明智,并且大多数用户不会更改它。)
我认为这在不同的版本中已经发生了变化;最初 IIRC 等宽字体的不同基本字体大小应用于
font-family
列表中包含monospace
的任何元素。现在,这种行为似乎只有在font-family
属性设置为完全monospace
时才会发生。您的courier, monospace
示例不会为我触发它;奇怪的是,使用monospace, sans-serif
也不会发生这种情况,即使字体将始终是monospace
并且sans-serif
永远不会用过的。此行为与 Firefox 相符。Yeah, WebKit has separate default font size preferences for normal and monospaced fonts. When you use a font size derived from a relative font size (ie none of the text's ancestor elements have an absolute font size), you get different sizes for monospaced and normal fonts.
(This wouldn't necessarily be a bad thing, except that the default preference of much smaller monospaced fonts isn't really sensible and most users won't have changed it.)
I think this has changed over different versions; originally IIRC the different base font size for monospaced fonts was applied to any element whose
font-family
list hadmonospace
in it. Now this behaviour only seems to happen when thefont-family
property is set to exactlymonospace
. Your example ofcourier, monospace
doesn't trigger it for me; weirdly, neither does it happen withmonospace, sans-serif
, even though then the font will always bemonospace
andsans-serif
will never be used. This behaviour matches Firefox.您可能没有在任何地方定义字体大小,因此它会回退到浏览器默认值。
You're probably not defining a font-size anywhere, so it's falling back to browser default.