RTF*_*RTF 18 html css internet-explorer font-face
我知道有很多类似的问题,但这种情况似乎很奇怪.对于Internet Explorer 11(Windows 7 Pro),@ font-face似乎已损坏.具体来说,版本:11.0.9600.17728,更新版本:11.0.18.
@ font-face在Chrome,Firefox,Safari,Opera(适用于Linux和Windows)上都能正常使用.事实上,它甚至可以在Internet Explorer版本: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>
Run Code Online (Sandbox Code Playgroud)
......和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;
}
Run Code Online (Sandbox Code Playgroud)
你可以在这里找到运行的代码.
如果我使用IE版本查看该页面导致问题,文本字体将是默认值,而不是图标,您只能看到span
标签中的字母.
鉴于@ font-face正在我测试过的所有其他浏览器中工作(即使是不同版本的IE 11),这可能是该版IE的错误,我还能做些什么来进一步修复或调试?
归档时间: |
|
查看次数: |
26529 次 |
最近记录: |