Почему этот код @ font-face не работает в Firefox 3.6? - PullRequest
Новая
       97

Почему этот код @ font-face не работает в Firefox 3.6?

4 голосов
/ 31 октября 2011

Я пытаюсь загрузить шрифт с помощью правила @font-face CSS. У меня это работает в любом браузере (включая IE6), кроме Firefox 3.6 и, может быть, даже ниже. Вот мой текущий код. 

@font-face {
    font-family: 'DigitaldreamFatRegular';
    src:    url('../fonts/digitaldreamfat-webfont.eot');
    src:    url('../fonts/digitaldreamfat-webfont.eot?#iefix') format('embedded-opentype'),
            url('../fonts/digitaldreamfat-webfont.woff') format('woff'),
            url('../fonts/digitaldreamfat-webfont.ttf') format('truetype'),
            url('../fonts/digitaldreamfat-webfont.svg#DigitaldreamFatRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

Он был сгенерирован Font Squirrel , поэтому теоретически должен быть идеальным. Я попробовал подключаемый модуль http-заголовков, и он показывает, что он вообще не запрашивается. Хотя шрифт, загруженный через веб-шрифты Google, работает отлично.

Кто-нибудь знает какие-либо предостережения в версии 3.6, которые могут вызвать такую ​​проблему? Я попытался запустить его локально и с сервера, это не имело никакого значения.

Пожалуйста, имейте в виду, что я тестировал только на Firefox 3.6 для Mac. Я постараюсь проверить, правильно ли работает версия Windows.

Любые предложения будут с благодарностью, спасибо.

Ответы [ 2 ]

3 голосов
/ 31 октября 2011

Вы используете шрифты из того же домена, что и ваш сайт?В противном случае FF не разрешает междоменные шрифты по умолчанию.Вы можете добавить заголовок «Access-Control-Allow-Origin» в ваши шрифты.Вот ссылка на то, как это сделать http://www.cssbakery.com/2010/07/fixing-firefox-font-face-cross-domain_25.html

Надеюсь, это поможет.

3 голосов
/ 31 октября 2011

Понял!

Это потому, что у меня установлены шрифты локально.Так что, используя смайлик , придуманный Полом Айришем, я могу это исправить.Вот правильный код. 

@font-face {
    font-family: 'DigitaldreamFatRegular';
    src:    url('../fonts/digitaldreamfat-webfont.eot');
    src:    local('☺'), // This addition fixes it.
            url('../fonts/digitaldreamfat-webfont.eot?#iefix') format('embedded-opentype'),
            url('../fonts/digitaldreamfat-webfont.woff') format('woff'),
            url('../fonts/digitaldreamfat-webfont.ttf') format('truetype'),
            url('../fonts/digitaldreamfat-webfont.svg#DigitaldreamFatRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
...