@font-face 和 font-variant 是个坏主意吗？
如果我使用@font-face字体和font-variant：小型大写字母作为同一选择器，字体将回退到Safari中的下一个系统默认字体。我该如何解决这个问题？
if i use @font-face font and font-variant: small-caps for the same selector the font will fallback to the next system default font in safari. how do i get around that?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
我一开始在创建一个示例来复制您的问题时遇到了一些麻烦，这让我意识到 font-face 不是标准的 CSS2 属性；等价的是font-family。所以我对 @font-face 做了一些快速研究，发现它——取决于你如何看待它——要么是 Firefox 3.5 特有的非标准属性，要么是尚未主流的 CSS3 的一部分。 Safari 对 CSS3 有部分支持，具体取决于版本，但我怀疑这是导致您出现不良行为的原因。
I had some trouble creating an example to replicate your issue at first, which made me realize that font-face is not a standard CSS2 attribute; the equivalent is font-family. So I did some quick research on @font-face, and found that it's -- depending on how you look at it -- either a non-standard attribute specific to Firefox 3.5 or a part of the not-yet-mainstream CSS3. Safari has partial support for CSS3, depending on version, but I suspect that this is the cause of your undesired behavior.
这是一个 WebKit 错误。该问题已修复，下次更新时 Safari 应该就可以正常工作了。当前版本的 Chrome 使用的是较新版本的 WebKit，该错误已得到修复。这是检测它的好方法（来自 SafariSmallCapsWebFontFix）
：例如，可以使用该 JavaScript 将类添加到
html节点并更改页面样式。This was a WebKit bug. It’s been fixed, and Safari should be fine the next time it’s updated. The current version of Chrome is using a newer version of WebKit where the bug has been fixed. Here’s a good way to detect it (from SafariSmallCapsWebFontFix):
You could use that JavaScript to, say, add a class to the
htmlnode and change how you style the page.好吧，我认为这只是一个错误:(我现在使用 :first-letter 伪选择器来实现这一点
Well i think its just a bug :( i now use :first-letter pseudo selector to achieve that