импортировать шрифт в Internet Explorer

Я хотел бы импортировать несколько шрифтов для использования на моем веб-сайте, я использую этот код, созданный Google.

HTML

<link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,700|Cuprum:400,700' rel='stylesheet' type='text/css'>

CSS

font-family: "Droid Sans", sans-serif;

Он работает в Firefox и Google Chrome, но в IE8 нет, почему?

EDITED: Adobe создает что-то вроде Google, и сценарий лучше, чем google, и отлично работает в Internet Explorer (подробнее см. http://html.adobe.com/edge/webfonts/)


html fonts css internet-explorer font-family
person Thyago Quintas    schedule 19.09.2012    source источник

Ответы (5)


arrow_upward
6
arrow_downward

Потому что он предоставляется только в формате WOFF, который не поддерживается IE8.

Здесь: http://www.fontsquirrel.com/fontfacedemo/Droid-Sans вы можете скачать один и тот же шрифт во всех необходимых форматах.

Затем добавьте следующий код в свой основной CSS:

@font-face {
    font-family: "Droid Sans";
    src: url('DroidSans-webfont.eot');
    src: url('DroidSans-webfont.eot?#iefix') format('embedded-opentype'),
         url('DroidSans-webfont.woff') format('woff'),
         url('DroidSans-webfont.ttf') format('truetype'),
         url('DroidSans-webfont.svg#DroidSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

Так что вы сможете и дальше использовать этот шрифт.

Обратите внимание, что файлы шрифтов должны находиться в той же папке вашей таблицы стилей.

person Giona    schedule 19.09.2012

arrow_upward
1
arrow_downward

Что-то не так с файлами шрифтов, созданными службой Google, по крайней мере, с точки зрения IE. IE 9 также не может отображать Droid Sans как обслуживаемый Google, и я проверил в режиме проверки (F12), что Google отправляет как файл EOT, так и файл WOFF в IE.

Проблема касается только некоторых шрифтов и может прерываться; ср. например на вопрос Как заставить Google Fonts работать в IE?

Таким образом, предложение GionaF об использовании FontSquirrel для создания файлов и их локального размещения представляется правильным решением.

person Jukka K. Korpela    schedule 19.09.2012

arrow_upward
0
arrow_downward

CSS, который Google возвращает для IE, включает шрифт @font-face woff, который поддерживается только в IE9 и выше.

person Roddy of the Frozen Peas    schedule 19.09.2012
comment
Согласно MDN IE8 не поддерживает @font-face для woff или svg шрифты. Думаю, я это уточнил. - person Roddy of the Frozen Peas; 19.09.2012

arrow_upward
0
arrow_downward

У меня были проблемы с IE8 при использовании кода @import, поставляемого Google Fonts. Следуя предложению средства устранения неполадок Google Fonts, я вставил URL-адрес, указанный в операторе @import, в IE, чтобы проверить, есть ли у меня ошибка, которая поможет мне отследить проблему. Что он сделал, так это загрузил некоторый код @ font-face, который я затем поместил в файл CSS вместо строки @import, и теперь все работает нормально в IE8 и Chrome. Я тестировал на iPad (сафари) и мне это тоже нравится.

Для некоторых это может сработать, но никаких гарантий! Надеюсь, это поможет другим, но у меня была эта проблема какое-то время, и это была настоящая боль. Кажется, это исправило ... пока что!

person onionjohnny    schedule 07.01.2014

arrow_upward
-1
arrow_downward

Просто добавьте в качестве шрифта без засечек.

Нравится:

font-family:'fontname', sans-serif;

Без засечек он работает в любом браузере

person Robin    schedule 03.04.2017