Chrome和谷歌网页字体的问题.显示来自Firefox的不同输出

Problem with Chrome and Google web fonts. Showing different output from Firefox

本文关键字：Firefox 输出 问题 谷歌 网页 字体 Chrome 显示      更新时间：2023-09-26

我使用谷歌网页字体为我的一个页面，但我得到一个不同的结果在Chrome浏览器从Firefox。Firefox的结果是正确的，我不知道为什么Chrome会出现这个问题。

代码很简单

intro { font-family: 'Open Sans Condensed', sans-serif; font-size:33px; line-height:38px; color: #404040;}
logo { font-family: 'Open Sans', sans-serif; }
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300italic&subset=greek' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:600&subset=greek,latin' rel='stylesheet' type='text/css'>

<logo>Logo goes here</logo>
<br><br>
<intro>Text goes right here</intro>

或者你可以在http://jsfiddle.net/KSVTA/或http://fiddle.jshell.net/KSVTA/show/中看到Chrome不使用Open Sans Condensed。

这是为什么，我怎么能解决它?

Open Sans Condensed是用font-style: italic定义的，所以你也需要将该样式应用到你的第二个文本:http://jsfiddle.net/KSVTA/1/.

该字体的CSS文件如下:

@media screen {
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: italic;
  font-weight: 300;
  src: local('Open Sans Cond Light Italic'), local('OpenSans-CondensedLightItalic'), url('http://themes.googleusercontent.com/static/fonts/opensanscondensed/v3/jIXlqT1WKafUSwj6s9AzV1qvxng10Zx7YyzmqNB25XX3rGVtsTkPsbDajuO5ueQw.woff') format('woff');
}
}

可以看到斜体的定义

如果你给你的"intro" CSS属性

font-style: italic;

那么它在Chrome中工作得很好。

另外，您可能想要阅读关于非标准HTML标记的旧问题

相关文章：