@ Font-Face Пользовательские шрифты не работают в Firefox

0

У меня возникли проблемы с получением пользовательского шрифта, отличного от websafe, для работы в Firefox. Я работаю в Chrome, Opera и Safari, используя следующий код:

@import url(http://fonts.googleapis.com/css?family=Antic+Slab);

@font-face {
font-family: 'BadgerFont';
src: url('http://www.vectorthatfox.co.uk/badgerandkingdom/fonts/oratorstd-webfont.eot');
src: url('http://www.vectorthatfox.co.uk/badgerandkingdom/fonts/oratorstd-webfont.eot?#iefix') format('embedded-opentype'),
     url('http://www.vectorthatfox.co.uk/badgerandkingdom/fonts/oratorstd-webfont.woff') format('woff'),
     url('http://www.vectorthatfox.co.uk/badgerandkingdom/fonts/oratorstd-webfont.ttf') format('truetype'),
     url('http://www.vectorthatfox.co.uk/badgerandkingdom/fonts/oratorstd-webfont.svg#orator_stdregular') format('svg');
font-weight: normal;
font-style: normal;
}

body{
font-family: BadgerFont, 'Antic Slab', Serif;
letter-spacing: 1px;
}

Что мне здесь не хватает? Вот ссылка на сайт, который вы хотите увидеть сами.

  • 0
    у меня работает в ФФ
  • 0
    Дерик, вы уверены, что видите шрифт @font-face font-face, а не шрифт Google Apis?
Показать ещё 1 комментарий
Теги:
font-face
firefox

2 ответа

5
Лучший ответ

По умолчанию Firefox будет принимать только относительные ссылки. Firefox (который поддерживает @font-face от версии 3.5) не позволяет по умолчанию использовать междоменные шрифты. Это означает, что шрифт должен быть отправлен из того же домена (и поддомена), если вы не можете добавить заголовок "Access-Control-Allow-Origin" в шрифт.

Или просто загрузите шрифт другим способом (локально или с CDN)

https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS#Access-Control-Allow-Origin

Поделиться
0

Вы должны научиться использовать свои инструменты разработчика в Firefox. Пятое сообщение консоли:

[08:28:41.886] Unrecognized at-rule or error parsing at-rule '@import'. @http://cdn.bigcartel.com/theme_stylesheets/19013562/2771282761/theme.css:474

Из MDN:

CSS-правило @import CSS позволяет импортировать правила стиля из других таблиц стилей. Эти правила должны предшествовать всем другим типам правил, кроме правил @charset; поскольку он не является вложенным выражением, он не может использоваться внутри условных групповых at-правил.

РЕДАКТИРОВАТЬ

Посмотрите на консоль, она дает вам все ответы

[11:00:17.697] downloadable font: download failed (font-family: "BadgerFont" style:normal weight:normal stretch:normal src index:1): bad URI or cross-site access not allowed
source: http://www.vectorthatfox.co.uk/badgerandkingdom/fonts/oratorstd-webfont.woff @ http://cdn.bigcartel.com/theme_stylesheets/19013568/2771283940/theme.css

Как говорится в сообщении, Firefox не позволит вам вставлять междоменные шрифты. Если вы хотите использовать этот шрифт, загрузите их с этого веб-сайта, если вам разрешено, и загрузите их в свой собственный домен и обратитесь к ним самостоятельно.

Поделиться
  • 0
    Спасибо за ваш ответ! Это заставило работать импортированный шрифт GoogleFont, но мой шрифт @ font-face 'BadgerFont' все еще не работает!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню