Google字体未显示Chrome和IE

我正在使用其包含的Google字体代码。他们的CSS是这样的：Google字体未显示Chrome和IE

@font-face { 
    font-family: 'Oswald'; 
    font-style: normal; 
    font-weight: 300; 
    src: url(http://themes.googleusercontent.com/static/fonts/oswald/v7/HqHm7BVC_nzzTui2lzQTDfY6323mHUZFJMgTvxaG2iE.eot); 
    src: local('Oswald Light'), local('Oswald-Light'), url(http://themes.googleusercontent.com/static/fonts/oswald/v7/HqHm7BVC_nzzTui2lzQTDfY6323mHUZFJMgTvxaG2iE.eot) format('embedded-opentype'), url(http://themes.googleusercontent.com/static/fonts/oswald/v7/HqHm7BVC_nzzTui2lzQTDT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'); 
}

使用这个我创建了一个CSS类

.oswald { 
    font-family: 'Oswald', Verdana, Arial, Helvetica, sans-serif 
}

然后，我使用这样的

<div class="oswald">text</div>

这里的地方就有点怪异。我使用Visual Studio，所以当我在本地调试时，我看到了正确的字体。当我把它放在服务器上时，它向我展示了Verdana字体。 Chrome也显示错误的前沿。 Safari和Firefox都显示正确的字体。

来源

2013-04-26 Jhorra

我已将Oswald Regular转换为必需的@font-face格式（TTF，OTF，EOT，SVG，WOFF）。

@font-face { 
    font-family: 'Oswald'; 
    font-style: normal; 
    font-weight: 300; 
    src: url('Archive/Oswald-Regular.eot'); 
    src: local('Oswald'), url('Archive/Oswald-Regular.woff') format('woff'), url('Archive/Oswald-Regular.ttf') format('truetype'), url('Archive/Oswald-Regular.svg#Oswald-Regular') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
}

这里是链接到包含转换后的字体ZIP档案：http://www.mediafire.com/?9xdr1w9wyvdoh09

来源

2013-04-26 02:29:38 NONE

它修复了Chrome浏览器，IE的任何想法？ – Jhorra 2013-04-26 02:50:06

我发现使用的CSS @import排除了很多更可靠，避免了有需要的字体格式的5倍为浏览器兼容。将其放入CSS文件的顶部：

@import url(http://fonts.googleapis.com/css?family=Oswald:400,700,300);

PS。这将包括：奥斯瓦尔德的light（），regular（font-weight: 400）和bold（font-weight: 700）。

来源

2013-04-26 03:31:57 James

这就是我所拥有的，我只是粘贴了他们在这里展示的CSS，这样你就可以看到一切。 – Jhorra 2013-04-26 03:33:44

Google字体未显示Chrome和IE

回答

相关问题