2010-11-01 1 views
1

Я уверен, что я не единственный, кого это преследует, но я не могу найти решение.font-face в Internet Explorer

@font-face прекрасно работает в Firefox, Chrome, Safari с TTF-шрифтами.

, как так:

@font-face{ 
    font-family: "Apple-Chancery" ; 
    src: url(images/Apple-Chancery.ttf) format("truetype"); 
} 

Однако, я понимаю, что для использования в Microsoft, шрифт должен быть в формате СРВ, поэтому я преобразовал его с помощью http://ttf2eot.sebastiankippe.com/

И мой код выглядит следующим образом :

@font-face{ 
    font-family: "Apple-Chancery" ; 
    src: local("Apple Chancery"), url(images/Apple-Chancery.eot), url(images/Apple-Chancery.ttf) format("truetype"); /* non-IE */  
} 

но он не работает в Internet Explorer. Я попытался поместить две разностные строки для src: я пробовал использовать другой конвертер, другой шрифт, и все некуда идти. Я использую IE8.

Кроме того, использование нескольких пользовательских шрифтов, мне нужно несколько @font-face блоков или я использую линию их font-family, src, font-family, src и т.д.?

+1

Обратите внимание, что шрифты в комплекте с OS X не лицензированы для вас, чтобы сделать доступными через веб-внедрение.Я не верю, что можно лицензировать Apple Chancery, но есть и другие простуды Zapf Chancery, которые вы можете получить. – bobince

+0

@bobince. Хорошая точка поднята – Ben

ответ

0

Эта страница может быть полезным для Вас: http://msdn.microsoft.com/en-us/library/ms530757%28VS.85%29.aspx

В частности, эта линия:

В Internet Explorer 8 и более ранних версий, только одно значение URL поддерживается.

Я думаю, что то, что вы пытаетесь сделать, может работать неправильно до тех пор, пока не будет доступен IE9. Стоит получить копию бета-версии (если вы используете что-то более новое, чем Windows XP), чтобы проверить и подтвердить это.

+0

Я пробовал делать это так, как описано в статье, и до сих пор нет. – Atey1

2

Как насчет использования белка шрифта для создания всех ваших файлов и вашего кода?

+0

все еще не работает в ie. прекрасно работает в firefox, chrome и safar, хотя я на самом деле собираюсь использовать это с этого момента, если я смогу понять, как заставить его работать в ie. Здорово! – Atey1

0

Вам нужно поставить IE (eot) один на отдельной строке, перед другими.

Правильная декларация:

@font-face{ 
    font-family: "Apple-Chancery" ; 
    src: url(images/Apple-Chancery.eot); /* IE */ 
    src: local("Apple Chancery"), url(images/Apple-Chancery.ttf) format("truetype"); /* non-IE */  
} 

Но это, вероятно, не достаточно, чтобы охватить все случаи, вы упускаете тип шрифта для SVG старых chromes, и т.д .. Я бы рекомендовал использовать шрифт-лицо генератор от fontsquirel.com, выберите опцию Easy, затем проверьте файл css для генерации и скопируйте/вставьте код и преобразованные файлы шрифтов

0

Во-вторых, использование Font Squirrel.

Вы также можете взглянуть на мой пост Adventures with @font-face, который может вам помочь.

2

Это может помочь вам,

@font-face { 
    font-family:"Apple-Chancery"; 
    src: url('../font/Apple-Chancery.eot'); /* IE9 Compat Modes */ 
    src: url('../font/Apple-Chancery.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
     url('../font/Apple-Chancery.woff') format('woff'), /* Modern Browsers */ 
     url('../font/Apple-Chancery.ttf') format('truetype'), /* Safari, Android, iOS */ 
     url('../font/Apple-Chancery.svg#svgFontName') format('svg'); /* Legacy iOS */ 
    font-weight:bold; 
    font-style:normal; 
} 
+1

Это только рабочий фрагмент, объясните его –

+0

У Internet Explorer есть ошибка в его синтаксическом анализаторе для шрифтов. Код '# iefix' - это то, что заставляет его работать в старой версии IE. [Ответ на этот связанный вопрос, заданный на SO, объясняет причину его работы] (http://stackoverflow.com/questions/8050640/how-does-iefix-solve-web-fonts-loading-in-ie6-ie8), а также ссылки на другой сайт с дополнительной информацией. –

0

Simpy загрузить шрифт на font2web он создает файл CSS и демонстрационный HTML-файл. Надеюсь, это поможет вам

 Смежные вопросы

  • Нет связанных вопросов^_^