0

我有一个 asp .net MVC3 应用程序，它大部分都在正常工作。

我在某些地方使用数据图标而不是图像。这些在除 IE (v9) 之外的所有浏览器中都可以正常渲染。我想知道为什么会这样，我能做些什么来解决它？

例如，我有一个跨度呈现如下所示的 html...

<span class="navIcon" aria-hidden="true" data-icon=""/>

在大多数浏览器中，它呈现如下......

工作图标

但在 IE 中它呈现这样的......

破碎的图标

有谁知道为什么会发生这种情况？

4

1 回答 1

2

最可能的原因是 IE9 选择不使用您在 .eot 中定义的任何格式@font-face（例如 IE9 会跳过.eot并继续寻找.woff版本）。我建议您使用Webfont Generator之类的东西来获得所有不同的字体变体。结果，您@font-face应该与此类似：

@font-face {
    font-family: 'Pictos';
    src: url('pictos-web.eot');
    src: local('☺'), 
    url('pictos-web.woff') format('woff'), 
    url('pictos-web.ttf') format('truetype'),
    url('pictos-web.svg#webfontIyfZbseF') format('svg');
}
于 2013-03-01T10:03:16.513 回答