Internet Explorer 中的 CSS 字体问题

Posted 2023-03-07

【中文标题】Internet Explorer 中的 CSS 字体问题

【英文标题】：css font issue in internet explorer

【发布时间】：2011-05-18 09:48:26

【问题描述】：

我在 CSS 中使用以下代码来呈现字体，但它在 IE 中不起作用

@font-facefont-family: BELOVED; src: url('font/BELOVED.TTF');

有什么建议吗？

【问题讨论】：

它在本地服务器上，无法为您提供链接（本地主机）

【参考方案1】：

不幸的是，IE 不支持 TTF 字体，因此您还需要使用 EOT，支持的类型/浏览器是

Internet Explorer（所有版本）：EOT Safari (3.2+)：TTF / OTF iPhone (3.1) SVG Chrome（所有版本）：SVG（TTF/OTF 添加于 2010 年 1 月 25 日） Firefox (3.5+)：TTF/OTF（.WOFF 添加到 3.6） Opera (10+) TTF/OTF

我在字体方面的成功有限，但我希望这会有所帮助。

【参考方案2】：

您最好访问 fontsquirrel.com 并创建一个 @font-face 工具包，这样您就可以获得最大的跨浏览器。 paul irish 还有一个漂亮的防弹跨浏览器示例，说明如何正确嵌入@font-face。

【参考方案3】：

IE 不支持TTF file format（2016 年 3 月更新）。

Here is a tool 将您的 TTF 转换为 EOT。

【参考方案4】：

很容易解决 转到此链接http://www.fontsquirrel.com/fontface/generator

上传你的字体

然后下载所有具有不同字体格式的文件，这些文件支持不同的浏览器并在您的项目中使用。现在它可以在所有浏览器中正常工作

【参考方案5】：

坏消息：IE 不支持 TTF 格式的标准字体。 （我一直对 IE 的使用难度感到惊讶）

好消息：IE 确实支持称为 EOT 的替代字体格式。您需要提供两种格式的字体并修改您的 CSS 以同时指定它们。

@font-face   
    font-family: Beloved;  
    src: url(/location/of/beloved.eot); /* IE */  
    src: local(Beloved), url(/location/of/beloved.ttf) format("truetype"); /* non-IE */  
  

一般来说，您应该能够将您的 TTF 字体转换为 EOT 格式而没有太多问题，但您可能会发现有些字体是无法转换的。在这种情况下，你就不走运了。

更多详情：http://randsco.com/index.php/2009/07/04/p680