IE 中不显示自定义符号字体

Question

以下设置

HTML

<!DOCTYPE html
SYSTEM "about:legacy-compat">
<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="UTF-8">
    <title>SymbolTest</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="HandheldFriendly" content="true">
    <meta http-equiv="cleartype" content="on">
    <link rel="stylesheet" type="text/css" href="css/style.css">
    </head>
    <body>
        <span class="greek">μ ω Ω ≥ ⊗ ↔  ± √ ≠ ♦ ♥ ♠ ⇐ ⇒ ⊥ ♦ ⊆ ∅</span>
    </body>
</html>

CSS

@font-face {
  font-family: Symbol;
  src: url("../fonts/Symbol/symbol.eot");
  src: url("../fonts/Symbol/symbol.eot?#iefix") format("embedded-opentype"), url("../fonts/Symbol/symbol.woff2") format("woff2"), url("../fonts/Symbol/symbol.woff") format("woff"), url("../fonts/Symbol/symbol.ttf") format("truetype"), url("../fonts/Symbol/symbol#symbolregularregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
span.greek {
  font-family: Symbol;
}

与其他浏览器相比，在 Internet Explorer 中产生非常奇怪的结果；

克罗地亚，本地

Chrome,服务器

FF，本地

FF，服务器

IE10，本地

IE10，服务器

IE11，本地

问我是否要允许 ActiveX 组件 - 请注意，在后台，使用的字体是默认的 windows 符号字体...

点击"accept"后变为

这是怎么回事？我使用 FontSquirrel 创建了字体并使用了“bulletproof”@font-face 语法，但它仍然没有按预期工作...?

Answer 1

经过进一步调查，问题似乎已经解决。正如 Mr Lister 指出的那样，IE 本身显然不喜欢粘贴 UTF8 符号并将它们包装在 Symbol 字体中。

我和一位设计师同事一起检查了 Symbol 字体，IE 似乎试图实际使用键入的字符（例如 U+221A 即 SQUARE ROOT）并将其映射到使用的字体 - Symbol.

Symbol 显然在代码点 8730 处没有适合字符的字符 - 因为 Symbol 仅支持 255 个字符。

这意味着，IE 将显示 ?。

这里有趣的一点是，其他浏览器回退到默认字体并使用字符的 UTF8 值并正确显示它。

我们现在采用的解决方案是不使用任何字体，反正整个发布过程都是UTF8，所以没有必要真正在任何地方使用Symbol字体。我们只需按原样复制所有字符，就可以了。

IE 中不显示自定义符号字体

Custom Symbol Font not displayed in IE

html

css

internet-explorer

font-face