使Adobe字体与IE9中的CSS3 @ font-face一起使用

Question

我正在构建一个小型Intranet应用程序,并尝试使用我最近购买的Adobe字体,但没有运气.据我所知,在我们的案例中,这不是违反许可证的行为.

我将.ttf/.otf版本的字体转换为.woff,.eot和.svg,以便定位所有主流浏览器.我使用的@ font-face语法基本上是Font Spring中的防弹语法:

@font-face {
    font-family: 'MyFontFamily';
    src: url('myfont-webfont.eot');
    src: url('myfont-webfont.eot?#iehack') format('eot'), 
         url('myfont-webfont.woff') format('woff'), 
         url('myfont-webfont.ttf')  format('truetype'),
         url('myfont-webfont.svg#svgFontName') format('svg');
    }

我修改了HTTP标头(添加了Access-Control-Allow-Origin ="*")以允许跨域引用.在FF和Chrome中它完美运行,但在IE9中,我得到:

CSS3111: @font-face encountered unknown error.  
myfont-webfont.woff
CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable. 
myfont-webfont.ttf

我注意到,当将字体从.ttf/.otf转换为.woff时,我也得到一个.afm文件,但我不知道它是否重要...

任何想法如何解决？

[编辑] - 我在IIS 7.5下托管我的网站(字体,但在单独的目录和静态内容的子域下)

Answer 1

我只能解释你如何解决"CSS3114"错误.
您必须更改TTF文件的嵌入级别.

使用适当的工具,您可以将其设置为允许可安装的嵌入.
对于64位版本,请检查@ user22600的答案.

Answer 2

正如Knu所说,你可以使用这个工具,但它只为MS-DOS编译.我为Win64编译了它.下载.

用法:

1. 将.exe放在与您需要修改的字体相同的文件夹中

2. 在命令行中导航到该目录

3. 输入type embed fontname.fonttype,用font和fonttype替换fontname,扩展名为ieembed brokenFont.ttf

4. 全部完成!您的字体现在应该可以使用

Answer 3

您应该将ie字体的格式设置为'embedded-opentype'而不是'eot'.例如:

src: url('fontname.eot?#iefix') format('embedded-opentype')

Answer 4

我收到以下错误:

CSS3114:@ font-face失败OpenType嵌入权限检查.权限必须是可安装的.
fontname.ttf

使用下面的代码后我的问题得到解决....

src: url('fontname.ttf') format('embedded-opentype')

谢谢你们帮助我!
干杯,
Renjith.

Answer 5

试试这个,在web.config中添加这一行.

<system.webServer>
  <staticContent>
     <mimeMap fileExtension=".woff" mimeType="application/octet-stream" />
  </staticContent>
</system.webServer>

Answer 6

一个不同的答案:法律问题.

在你这样做之前,有几点需要注意.首先,要获得此错误,在IE中,检查元素,切换选项卡,并查找错误,我相信"CSS3114"出现在控制台中.

您需要了解的是这是许可问题.IE(双关语)如果你试图加载导致此错误的字体,你没有文件的权限来使用该字体,如果你没有权限,你很可能会失去一个除非您持有许可证,否则以这种方式使用此字体的法律斗争(本身极不可能).所以,你可以第一次感谢IE浏览器是唯一一个告诉你"不"的浏览器,因为它至少让你知道你在做一些有问题的事情.

那就是说,这是你的答案:

首先确保您使用.css中的最佳代码,请参阅其他一些css答案.
IE 11 css示例(适用于所有现代浏览器可能需要针对IE9进行调整):

@font-face {
font-family: "QuestionableLegalFont";
font-weight: bold;
src: url('../fonts/QuestionableLegalFont.ttf') format('truetype');
}

然后,确保您有一个可用的网络字体(您可能已经通过在其他浏览器中查看您的字体来了解这一点).如果您需要在线字体转换器,请访问:https: //onlinefontconverter.com/

最后,要摆脱"CSS3114"错误.有关在线工具,请单击此处:https://www.andrebacklund.com/fontfixer.html

Answer 7

确实,IE9要求TTF字体将嵌入位设置为Installable.Generator会自动执行此操作,但由于其他原因,我们目前正在阻止Adobe字体.我们可能会在不久的将来解除这个限制.

Answer 8

由于这个问题,我浪费了很多时间.最后我找到了很好的解决方案.在我使用.ttf字体之前.但我添加了一个额外的字体格式.但它开始在IE中工作.

我使用了以下代码,它在所有浏览器中都像魅力一样.

@font-face {
font-family: OpenSans;
src: url(assets/fonts/OpenSans/OpenSans-Regular.ttf), 
url(assets/fonts/OpenSans/OpenSans-Regular.eot);
}

@font-face {
font-family: OpenSans Bold;
src: url(assets/fonts/OpenSans/OpenSans-Bold.ttf),
url(assets/fonts/OpenSans/OpenSans-Bold.eot);
}

我希望这会对某人有所帮助.