Question

我使用font-awesome为我的rails应用程序（不使用gem）生成图标字体，我创建的图标字体适用于Chrome，FF，Safari和IE10 / 11，但不适用于IE9。我使用以下代码创建了一个最小的测试用例，它适用于除IE9之外的所有内容（这不是rails，只是一个html文件，一个css文件和字体文件）：

CSS：

@font-face {
  font-family: "my-icons";
  src: url("my-icons.eot");
  src: url("my-icons.eot?#iefix") format("embedded-opentype"),
       url("my-icons.woff") format("woff"),
       url("my-icons.ttf") format("truetype"),
       url("my-icons.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

.icon-test:before {
  font-family: "my-icons";
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  *margin-right: .3em;
}

.icon-test:before { content: "\f113"; }

HTML：

<html>
<head>
    <link rel="stylesheet" href="styles/font_face.css">
</head>
    <div class="test-container">
        test
        <i class="icon-test"></i>
    </div>
</html>

这在Chrome和FF中运行得很好，但在IE9中却没有。我搞乱了格式，MIME类型（在实际的rails应用程序中），我不确定下一步该去哪里。想法？

Answer 1

我经常使用自定义字体，到目前为止我没有遇到任何问题。以下是我将要使用的内容

@font-face {
font-family: "my-icons";
src: url("my-icons.eot?#iefix");
src: url("my-icons.eot?#iefix") format("eot"),
   url("my-icons.woff") format("woff"),
   url("my-icons.ttf") format("truetype"),
   url("my-icons.svg") format("svg");
font-weight: normal;
font-style: normal;
}

Icon Font在IE9中不起作用，但适用于其他版本的IE和其他浏览器

1 个答案: