css 不同系列的不同字体大小
我有一个像这样的 CSS 声明:
font-family: font1, font2, font3;
其中 font1 是嵌入的 eot/ttf 字体,但问题是该字体比其他字体小,所以我想为该字体(font1)使用不同的字体大小(1.8em) )。所有其他字体(font2、font3)保持不变。
问题是,我无法验证用户的浏览器是否使用 font1、font2 或 font3。是否有任何 CSS 声明允许不同系列使用不同的字体大小?
谢谢。
I have a CSS declaration like this:
font-family: font1, font2, font3;
where font1 is an embedded eot/ttf font, but the problem is that this font is smaller than the other fonts so I want to have a different font-size (1.8em) for this font (font1). All other fonts (font2, font3) stay untouched.
The problem is, that I cannot verify if the user's browser uses font1, font2 or font3. Is there any css declaration which allows different font-sizes for different families?
Thanks.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
有一种方法可以做到这一点,但到目前为止它的支持非常差。您正在寻找的 CSS 属性是
font-size-adjust
- 专门为解决此问题而引入的新 CSS3 属性。规范说:但是,目前仅 Firefox 支持它,因此您可能需要寻找替代方案。
有关如何使用它的示例,请参阅:
http: //webdesignernotebook.com/css/the-little-known-font-size-adjust-css3-property/
https://developer.mozilla.org/en/CSS/font-size-adjust
http://www.fonttester.com/help/css_property/font-size -调整.html
http://www.w3. org/TR/css3-fonts/#relative-sizing-the-font-size-adjust-pro
There is a way to do this, but it's as of now very badly supported. The CSS property you are looking for is
font-size-adjust
- a new CSS3 property introduced specifically to address this problem. The specification says:However, it is only supported in Firefox as of now, so you might want to look for alternatives.
For examples of how to use it, see:
http://webdesignernotebook.com/css/the-little-known-font-size-adjust-css3-property/
https://developer.mozilla.org/en/CSS/font-size-adjust
http://www.fonttester.com/help/css_property/font-size-adjust.html
http://www.w3.org/TR/css3-fonts/#relative-sizing-the-font-size-adjust-pro
我知道已经有一段时间了,但最近我偶然发现了与 OP 描述的相同的问题。由于
font-size-adjust
的支持仍然很差,我想分享另一个对我有用的解决方案:注意:以下解决方案仅在使用嵌入字体时才有效
@font-face
-声明。在这种情况下,只需
在您的
@font-face
-声明中包含例如即可。相关字体将仅显示为指定尺寸的 90%。浏览器支持
浏览器支持目前为 74%,支持所有主要浏览器Safari 和 IE 除外。我知道这远非最佳。但由于这个问题“只是”关于设计而不是功能,我认为有总比没有好。
I know it has been a while, but recently I stumbled upon the very same problem as described by the OP. As
font-size-adjust
is still very poorly supported, I'd like to share another solution that worked for me:Note: The following solution does only work if the fonts are embedded using the
@font-face
-declaration.In that case just include e.g.
in your
@font-face
-declaration. The relevant font will appear at only 90% the size of the specified size.Browser support
Browser support is currently at 74% with all major browsers supported except for Safari and IE. I know this is far from optimal. But as this problem is "just" about design and not about functionality, I suppose it is better than nothing.