css - google webfont 不能在 IE 中工作

Question

我在使用 Google 网络字体时遇到了一些奇怪的行为。现在我像嵌入样式表一样使用它，它工作正常。

<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:300|Orienta' rel='stylesheet' type='text/css'>

但是当我将这个@font-face 值用于我的 css 文件时，它无法正常工作。

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v4/toadOcfmlt9b38dHJxOBGNbE_oMaV8t2eFeISPpzbdE.woff) format('woff');
}
@font-face {
  font-family: 'Orienta';
  font-style: normal;
  font-weight: 400;
  src: local('Orienta'), local('Orienta-Regular'), url(http://themes.googleusercontent.com/static/fonts/orienta/v1/nPJ0J30J_zQZtBhztPPbaA.woff) format('woff');
}

这些代码发生了什么，我认为在两者之上的作用是一样的。伙计们有什么想法吗？

注意。我还计划将此字体下载到我的系统并从服务器加载它。提前致谢。

Answer 1

您的字体需要有一个 .eot 扩展名才能在 IE 中使用。您可以在这里使用生成器 http://www.fontsquirrel.com/fontface/generator