字体未在ie 10或11中呈现

Question

我的网站：http://arethebaronsplaying.com/

在IE10或IE11中没有正确地呈现字体。下面是我的css：

@font-face {
font-family: 'Mono Social Icons Font';
src: asset_url('fonts/MonoSocialIconsFont-1.10.eot');
src: asset_url('fonts/MonoSocialIconsFont-1.10.eot?#iefix') format('embedded-opentype'),
     asset_url('fonts/MonoSocialIconsFont-1.10.woff') format('woff'),
     asset_url('fonts/MonoSocialIconsFont-1.10.ttf') format('truetype'),
     asset_url('fonts/MonoSocialIconsFont-1.10.svg#MonoSocialIconsFont') format('svg');
src: asset_url('fonts/MonoSocialIconsFont-1.10.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

@font-face {
  font-family: 'hamilton18';
  src: asset_url('fonts/hamilton_wood_type_foundry_-_hwtunitgothic-718-webfont.eot');
  src: asset_url('fonts/hamilton_wood_type_foundry_-_hwtunitgothic-718-webfont.eot?#iefix') format('embedded-opentype'),
   asset_url('fonts/hamilton_wood_type_foundry_-_hwtunitgothic-718-webfont.woff') format('woff'),
   asset_url('fonts/hamilton_wood_type_foundry_-_hwtunitgothic-718-webfont.ttf') format('truetype'),
   asset_url('fonts/hamilton_wood_type_foundry_-_hwtunitgothic-718-webfont.svg#MonoSocialIconsFont') format('svg');
  src: asset_url('fonts/hamilton_wood_type_foundry_-_hwtunitgothic-718-webfont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

在chrome/safari/firefox中，一切看起来都很棒。有什么想法吗？

Answer 1

查看您网站IE中的控制台，会出现以下错误-

CSS3114：@ OpenType嵌入权限检查失败。权限必须是不可更改的。

在web上，讨论这个问题的两个链接是：https://github.com/tapquo/lungo.icon/issues/1和http://codecanyon.net/forums/thread/css3114-fontface-failed-opentype-embedding-permission-check-permission-must-be-installable/78963。

公共解决方案链接：http://carnage-melon.tom7.org/embed/

然而，该工具似乎只适用于较旧版本的窗口，而不适用于最新版本的windows。

Answer 2

要解决这个问题，只需将-ms-font-feature-settings:"liga" 1;添加到css中即可。

例如：

.social .icon {
  -ms-font-feature-settings:"liga" 1;
  font-family:'Mono Social Icons Font';
  -webkit-text-rendering:optimizeLegibility;
  -moz-text-rendering:optimizeLegibility;
  -ms-text-rendering:optimizeLegibility;
  -o-text-rendering:optimizeLegibility;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-font-smoothing:antialiased;
  -ms-font-smoothing:antialiased;
  -o-font-smoothing:antialiased;
  font-smoothing:antialiased;
}