以下设置
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中产生非常奇怪的结果;
Crome,Local
Chrome,服务器
FF,本地
FF,服务器
IE10,本地
IE10,服务器
IE11,本地
问我是否想要允许ActiveX组件 - 请注意,在后台,使用的字体是默认的Windows Symbol字体...
点击&#34;接受&#34;后,它会变为
这里发生了什么?我使用FontSquirrel创建了字体并使用了&#34; 防弹&#34; @font-face
语法,但它仍未按预期工作......?
答案 0 :(得分:0)
经过进一步调查,问题似乎得到了解决。正如Lister 先生指出的那样,当你粘贴UTF8符号并用Symbol
字体包装它们时,IE本身显然不会喜欢。
我与设计师同事检查了Symbol字体,看来IE尝试实际使用输入的字符(例如U+221A
SQUARE ROOT
)并将其映射到使用的字体 - {{ 1}}。
Symbol
显然在代码点Symbol
没有适当的字符 - 因为8730
仅支持255个字符。
这意味着,IE将显示Symbol
。
这里有趣的是,另一个浏览器回退到默认字体并使用字符的UTF8值并正确显示。
我们现在使用的解决方案是不使用任何字体,因为整个发布过程无论如何都是UTF8,因此无需在任何地方实际使用?
字体。我们只是按原样复制所有字符,并且它可以正常工作。