Подтвердить что ты не робот

Ошибка Internet Explorer @font-face

Я пытаюсь заставить Internet Explorer отображать мои симпатичные шрифты. Это не работает. Они отлично работают в Firefox, и я вижу в своих журналах доступа к Apache, что IE вытащил шрифты. Таким образом, он анализирует тег CSS шрифта, просто не делая его.

Я использовал для преобразования шрифтов: http://www.kirsle.net/wizards/ttf2eot.cgi. Я попробовал этот инструмент WEFT от Microsoft, но он не будет работать должным образом. После установки и открытия, он сказал: "В первый раз запустите его, сделайте это...", затем он постоянно повесился.

Вот мой CSS:

@font-face
{
   font-family: 'HelveticaLTCN';
   src: url('HelveticaNeueLTCom-LtCn_0.eot');
   src: local('HelveticaNeuel TCom LtCn'), url('HelveticaNeueLTCom-LtCn_0.ttf') format('TrueType');
}

Любые идеи относительно того, почему IE не отображает шрифты?

EDIT: Должен также упоминаться, я вызываю шрифт с помощью:

p .mytext
{
   font-family: HelveticaLTCN;
}
4b9b3361

ОТВЕТЫ

Ответ 1

Если вы бросили полотенце или вы все еще боретесь с этим, я настоятельно рекомендую белку шрифта. Он заменяет WEFT намного лучше, чем любые другие онлайн-генераторы .eot. В качестве огромного бонуса он предоставляет все необходимые кросс-браузерные форматы в одном zip файле вместе с рабочей страницей CSS + HTML. Это самая близкая вещь для @fontface nirvana.

Ответ 2

Помните, что:.eot шрифты должны быть последним "src". Если нет, IE переписал бы конфигурацию и разбил шрифт.

@font-face {
    font-family: "Aller Bold";
    src: url(fonts/Aller_Bd.ttf) format("truetype");
    src: url(fonts/Aller_Bd.eot);
}

Ответ 3

Internet Explorer немного отличается от других определений @font-face. Ранее я обнаружил, что это потрясающая помощь - http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/

Короче говоря, они рекомендуют лучший способ: Единственное изменение - добавить знак вопроса в конец URL-адреса шрифта. Странно, нет?

@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot?') format('eot'), url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf') format('truetype');
}

Существует ряд других альтернатив, а именно: указание отдельных тегов @font-face для файла EOT из других.

Ответ 4

У меня были те же проблемы, с которыми сталкивались многие люди. Проблема оказалась просто в том, что IE имеет более короткий лимит символов на значение семейства шрифтов. Я дал моему семейству шрифтов более короткое имя, и, наконец, он работал с помощью css, который вышибала белок шрифта.

Странный!

Ответ 5

Одна вещь, которую вам нужно проверить, -

.css файл и .eot должны находиться в одной папке, если вы используете url ('HelveticaNeueLTCom-LtCn_0.eot')

или сделать полный URL-адрес, например src: url (http://www.example.com/path/to/url/Helvetica.eot)

Котировки являются необязательными, насколько мне известно.

ps # Я занимаюсь встраиванием шрифтов в свой блог в течение долгого времени, его работа прекрасна.

Ответ 6

Лучшее определение для font-face:

@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot?') format('eot'), url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf') format('truetype');
}

Ответ 7

Для меня работала следующая декларация:

@font-face {
    font-family: 'Frutiger45LightBoldItalic';
    src: local('☺'), url('../font/frutiger-bolditalic-webfont.woff') format('woff'), url('../font/frutiger-bolditalic-webfont.ttf') format('truetype'), url('../font/frutiger-bolditalic-webfont.svg#webfontR2tDy7QH') format('svg'), url('../font/frutiger-bolditalic-webfont.eot');
}

Таким образом, существует только 1 src атрибут и .eot находится в конце его, без вопросительного знака.

Что я пробовал раньше и не работал:

  • установка .eot на отдельной строке (до или после другого src)
  • поставить знак вопроса после .eot

Ответ 8

Это сработало для меня:

@font-face {
    font-family : 'din-pro';
    src         : url('../fonts/din/DINPro-Medium.woff') format('woff');
    src         : url('../fonts/din/DINPro-Medium.otf') format('otf');
    src         : url('../fonts/din/DINPro-Medium.ttf') format('truetype');
    font-weight : 500;
    font-style  : normal;
}

@font-face {
    font-family : 'din-pro';
    src         : url('../fonts/din/DINPro-Regular.woff') format('woff');
    src         : url('../fonts/din/DINPro-Regular.woff2') format('woff2');
    src         : url('../fonts/din/DINPro-Regular.ttf') format('truetype');
    font-weight : 400;
    font-style  : normal;
}
@font-face {
    font-family : 'din-pro-ie';
    src         : url('../fonts/din/DINPro-Regular.eot?');
    font-weight : 400;
    font-style : normal;
}
@font-face {
    font-family : 'din-pro-ie';
    src         : url('../fonts/din/DINPro-Medium.eot?');
    font-weight : 500;
    font-style : normal;
}

Обратите внимание, что я определил шрифт для IE отдельно с суффиксом -ie. При использовании шрифта я бы сделал что-то вроде p { font-family : din-pro, din-pro-ie }. Протестировано и работает с IE5 с использованием эмуляции.

Ответ 9

IE не будет принимать шрифт, который содержит строку формата в дескрипторе src - эта вторая строка src может быть виновником. Что произойдет, если вы удалите его (или удалите строку формата?)

Далее - иногда IE может быть немного педантичным относительно того, используете ли вы кавычки вокруг значений в CSS. Попробуйте вместо font-family: "HelveticaLTCN"?

Ответ 10

У меня была та же проблема, что и панас. Я преобразовал из ttf в eot с помощью onlinefontconverter.com. Ну, похоже, это была проблема: я просто попробовал fontsquirrel.com, как указал atsjr, и все работает нормально!

Ответ 11

Во время борьбы с подобной проблемой я заметил, что как-то определение DOCTYPE влияет на встроенные шрифты в IE. Когда я удалил определение DOCTYPE, шрифт отображается правильно.

Ответ 12

этот код может решить мою проблему в IE:

  @font-face {
      font-family: 'kurdish';
      src: url('font/zkurd_aras.eot?') format('eot'), url('font/zkurd_aras.woff') format('woff'), url('font/zkurd_aras.ttf') format('truetype');}

Ответ 13

Всегда лучше направить атрибут font-face локально, а не онлайн, например. URL ( '../шрифты/шрифта name.eot'). IE и другие браузеры не будут "видеть" шрифты, когда вы используете свою веб-страницу на локальном сервере.

Ответ 14

Одна особенность IE заключается в том, что для этого требуется, чтобы имя семейства шрифтов было таким же, как имя, найденное в свойствах шрифта. Хотя Chrome и другие позволяют вам называть семейство шрифтов тем, что вы хотите, это не тот случай, когда IE