我知道有很多类似的问题,但是这种情况看起来确实很奇怪。对于Internet Explorer 11(Windows 7 Pro),@ font-face似乎已损坏。具体来说,版本:11.0.9600.17728,更新版本:11.0.18。
@ font-face在Chrome,Firefox,Safari,Opera(适用于Linux和Windows)上都可以正常工作。实际上,它甚至可以在InternetExplorer版本:11.0.9600.17633,更新版本:11.0.16上运行,也可以在我拥有的另一台计算机上的Windows 7上运行。
开发者控制台中没有任何内容指示获取字体有任何问题。我将html/css简化为一些非常基本的内容,以重现此问题。在以下情况下,两种自定义字体均无效(对于该特定IE版本):
<html> <head> <link rel="stylesheet" type="text/css" href="test.css" /> </head> <body> <p>This font should be Roboto Thin</p> <p>There should be icons below. If not, then font-face is not working.</p> <span>a</span> <span>b</span> <span>c</span> <span>d</span> <span>e</span> <span>f</span> <span>g</span> <span>h</span> <span>i</span> <span>j</span> <span>k</span> <span>l</span> <span>m</span> </body> </html>
…and the CSS:
@charset "UTF-8"; @font-face { font-family: 'robotothin'; src: url('roboto-thin-webfont.eot'); src: url('roboto-thin-webfont.eot?#iefix') format('embedded-opentype'), url('roboto-thin-webfont.woff') format('woff'), url('roboto-thin-webfont.ttf') format('truetype'), url('roboto-thin-webfont.svg#robotothin') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'typicons'; src: url('typicons-regular-webfont.ttf'); } p { font-family: robotothin; font-size: 26px; color: #666; } span { font-family: typicons; font-size: 30px; color: #0062A8; }
如果我使用导致问题的IE版本查看该页面,则文本字体将是默认字体,而不是图标,您只会在 span标记中看到字母。
鉴于@ font-face在我测试过的所有其他浏览器(甚至是IE 11的不同版本)中都能正常工作,是否可能是该版本IE 的错误,我是否可以做进一步的修复或调试?
在描述这可能涉及与安全设置的问题 这个错误报告。
在“ Internet选项”中,转到: