WOFF字体在Internet Explorer中无法正常工作

Question

WOFF字体在Internet Explorer中无法正常工作

3

我有一个页面使用了字体Avenir。在所有浏览器（Firefox，Opera，Chrome）中都可以正常显示，但在Internet Explorer 11中无法显示该字体。我使用以下代码附加字体（它似乎用于适配Internet Explorer）：

<style type="text/css">
@font-face { font-family:"Avenir LT Std 35 Light"; src:url("./Fonts/Avenir LT Std 35 Light.eot"); } /* for IE */
@font-face { font-family:"Avenir LT Std 35 Light"; src:url("./Fonts/Avenir LT Std 35 Light.woff") format("woff"); } /* Works only in WOFF-enabled browsers */
.ft0{font-family:"Avenir LT Std 35 Light";font-size:16.67px;color:#BFBFBF}
.ft1{font-family:"Avenir LT Std 35 Light";font-size:15.33px;color:#BFBFBF}
.ft2{font-family:"Avenir LT Std 35 Light";font-size:12.50px;color:#BFBFBF}
.ft3{font-family:"Avenir LT Std 35 Light";font-size:12.50px;color:#292C31}
.ft4{font-family:"Avenir LT Std 35 Light";font-size:15.33px;color:#FE4A5E}
.ft5{font-family:"Avenir LT Std 35 Light";font-size:15.33px;color:#000000}
.ft6{font-family:"Avenir LT Std 35 Light";font-size:15.33px;color:#00B0F0}
.ft7{font-family:"Avenir LT Std 35 Light";font-size:15.33px;color:#262626}
.ft8{font-family:"Avenir LT Std 35 Light";font-size:15.33px;color:#0D0D0D}

</style>

不确定为什么它不起作用... 你能看一下吗？

Dave

- Gabriel

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Johannes · Answer 1

可以尝试这样做：

@font-face { 
  font-family:"Avenir LT Std 35 Light"; 
  src: url("./Fonts/Avenir LT Std 35 Light.eot");
  src: url("./Fonts/Avenir LT Std 35 Light.eot?#iefix") format("embedded-opentype"),  
       url("./Fonts/Avenir LT Std 35 Light.woff") format("woff"); 
}

顺便说一下：所有这些逗号大小都将四舍五入到下一个完整的像素 - 也许IE也会有问题（？-不确定）