Question

我的@ font-face样式编写如下：

@font-face {
  font-family: 'Din';
  src: url('/fonts/DINWebPro.eot?') format('eot'),
       url('/fonts/DINWebPro.woff') format('woff');

}

它在除IE7和8之外的每个浏览器中都有效，任何人都有任何想法吗？

谢谢

Answer 1

使用fontsquirrel的@ font-face生成器生成所需的所有字体文件类型，我认为早期的IE喜欢使用.svg字体文件（你没有）。

fontsquirrel会获取你的字体文件，生成包含其他扩展名的所有字体文件，然后再给你一个css文件，告诉你如何使用它们。

使用此方法可确保您的自定义字体适用于所有主流浏览器，甚至是旧的IE

Answer 2

如果您在http://www.fontsquirrel.com/fontface/generator处使用生成器，则可以在每个浏览器中嵌入相当不错的结果。

话虽如此，你的问题包括IE的细微差别。

“......所以保罗设计的是一种在它之前拦截IE的方法到达“有问题”的格式。使用最好的CSS黑客（一个没有无意义的语法），他在浪费带宽之前转移了IE 抓住一个不必要的文件 - 在它窒息之前。“

请参阅下面的src: local("☺")

Paul Irish建议如下：

@font-face {
  font-family: "Your typeface";
  src: url("type/filename.eot");
  src: local("☺"),
    url("type/filename.woff") format("woff"),
    url("type/filename.otf") format("opentype"),
    url("type/filename.svg#filename") format("svg");
  }

请注意笑脸很严肃。它是html字符☺

还有great summary列出了该过程的每一步。

@ font-face不在ie7和ie8上工作

2 个答案: