10

我一直在寻找几个小时，问了朋友，但没有成功。所以我希望你们能帮助我。我的网站使用自定义字体，但 IE(10) 不支持我这样做的方式。我不知道它支持其他方法。这是我的：

    @font-face { font-family: shardee; src:url('fonts/Shardee.ttf'); }

没有必要在 Internet Explorer 中使用自定义字体，但它会很好。

当 Internet Explorer 不知道该字体时，它会使用其默认字体。但问题是，自定义字体的字体大小是完美的，但 Internet Explorer 默认字体的字体太大了。我尝试使用特定于 IE 的 css 代码来修复它，但它根本不起作用。我正在为内部资源管理器使用以下 css 代码：

    <!--[if IE]>
      <style>
          #menu ul li{ font-size:15px; }
      </style>
    <![endif]-->

我还尝试了一个外部样式表，它看起来像这样：

    <!--[if IE]>
      <link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_directory_uri() ?>/style/ie.css" />
    <![endif]-->

我在 php 中使用的函数是一个 wordpress 函数，可以将您带到您的网站路径。如果您不使用 wordpress，则可以忘记该代码并将其留空。

问题不在于路径，路径是正确的。我在浏览器中查看了源代码，它显示了我在 ie.css 中的代码。ie.css 中的代码与上面完全相同，但没有标签等。

我希望你们能帮助我解决这个问题。据我所知，有两种解决方案。让 ie 特定的 css 工作，或者告诉我一种在 IE 中创建自定义字体的方法。我使用的是 Internet Explorer 版本 10。

你可以在这里看到这个网站，但是一旦它被修复它就会消失，因为一旦它被修复我就不需要把它放在子域上。

亲切的问候，巴特·罗洛夫斯

4

6 回答 6

18

多种字体格式

要支持广泛的浏览器，请使用字体的.ttf, .woff和.eot版本。

@font-face {
    font-family: 'shardee';
    src: url('fonts/Shardee.eot');
    src: url('fonts/Shardee.eot?#iefix')
             format('embedded-opentype'),
         url('fonts/Shardee.woff') format('woff'),
         url('fonts/Shardee.ttf') format('truetype');
}

您可以使用Font Squirrel之类的字体转换网站，将.ttf字体转换为.woffand .eot。

DRM 误报

正如@Jukka 指出的那样，TTF 文件存在法律问题，导致它无法在 Windows 中使用。在 IE 开发者控制台中，显示如下错误信息：

CSS3114: @font-face failed OpenType embedding permission check.
Permission must be Installable.

Shardee似乎是一种带有未知许可证类型的废弃字体。尽管使用这种字体可能是合法的，但 Windows 似乎要求每个 TTF 文件都有 DRM 信息，明确表明将其嵌入网页是合法的。IE 中的错误很可能是误报。

为了测试这一点，我采用了一种 TTF 字体，该字体已知是合法许可在网站上使用的。由于 DRM 错误，TTF 版本在 IE 中不起作用。这个例子绝对是一个误报。这就是为什么需要使用多种字体格式的原因之一，也是为什么像 TTF 这样的单一格式不能在所有浏览器上工作的原因之一。

虽然 Windows 不允许 IE 使用 TTF 文件，但 IE 仍然可以使用 WOFF 或 EOT 版本。当我在本地网络服务器上使用所有三种字体格式测试上述@font-face规则时，Shardee 字体在所有版本的 IE 中都正确呈现（尽管在 IE 开发者控制台中出现错误消息）。

尝试步骤：

  1. 将.ttf文件转换为.woff和.eot
  2. .woff将和文件上传到.eot与现有文件相同的目录.ttf。
  3. 用上面的规则替换@font-face规则。我在它的初始版本中修正了几个错别字。

如果仍有问题，则可能是 Web 服务器设置有问题。相关问题：IE9 阻止下载跨域网络字体

于 2013-04-01T13:17:17.420 回答
3

IE11： 如果您CSS3114在开发工具中收到错误代码，则需要修改字体文件的第一位。这将允许 IE 安装字体。

npm 模块： 您可以使用ttembed-jsnpm 模块，它会为您进行修改。 https://www.npmjs.com/package/tembed-js

用法： ttembed-js path/to/Shardee.ttf

于 2016-09-15T20:53:37.563 回答
3

通过在网上搜索，我发现了这个在线工具，它对 TTF 字体进行了修复，使其可以在 Explorer 中显示： https ://www.andrebacklund.com/fontfixer.html

于 2017-04-26T12:17:17.153 回答
2

所以问题显然是在 IE 10 上，元素内的菜单id=menu没有出现在声明的字体“shardee”中，而是出现在浏览器的默认字体中。这实际上使菜单可读。但从技术上讲，可以在控制台窗格中的开发人员工具（按 F12 进入）中看到解释。带有代码 CSS3114 的错误消息表明@font-face未通过嵌入使用权限的检查。

查看字体的使用权，如有可能，请联系版权持有人（推测为Bright Ideas）获取权利。

于 2013-04-01T13:44:49.000 回答
2

FontPrep是 Mac OS X 的优秀 Web 字体生成器。它甚至可以创建 fonts.css

于 2014-01-17T23:14:51.450 回答
0

我遇到了同样的问题并运行了 F12。我所在的网站似乎在 IE10 中启用了兼容性视图。一旦我禁用兼容性查看显示的自定义字体。希望这可以帮助某人...

于 2015-12-04T20:17:16.763 回答