Шрифты WOFF не работают в Internet Explorer
У меня есть страница, которая использует шрифт 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>
Не уверен, почему это не работает.... Можете ли вы взглянуть?
Дейв
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 также имеет проблемы с этим (? - не уверен)