У меня есть пользовательский шрифт на моем веб-сайте, и я загрузил его на свой сайт.Почему мой веб-шрифт не применяется?
This - это мой сайт.
Я хочу применить весь свой Интернет oswaldlight
. Так как сейчас, я загрузил шрифт в известную папку для меня и добавили его в качестве @font-face
, как это:
@font-face {
font-family: 'oswaldlight';
src: url('../font/oswald/oswald.light-webfont.eot');
src: url('../font/oswald/oswald.light-webfont.eot?#iefix') format('embedded-opentype'),
url('../font/oswald/oswald.light-webfont.woff2') format('woff2'),
url('../font/oswald/oswald.light-webfont.woff') format('woff'),
url('../font/oswald/oswald.light-webfont.ttf') format('truetype'),
url('../font/oswald/oswald.light-webfont.svg#oswaldlight') format('svg');
font-weight: normal;
font-style: normal;
}
Этот фрагмент кода был добавлен в моем фтп. А если проверить, какой шрифт использует каждый заголовок, вы видите это с помощью Firebug:
element.style {
color: #000000;
font-size: 24px;
font-weight: normal;
line-height: 40px;
margin: 12px 0 0;
padding: 0;
text-align: left;
text-transform: uppercase;
}
*::before, *::after {
box-sizing: border-box;
}
*::before, *::after {
box-sizing: border-box;
}
.heading h2 {
font-family: "oswaldlight";
font-size: 24px;
font-weight: normal;
line-height: 30px;
text-transform: uppercase;
}
Но это еще не применяется к моей статье. Любая идея, почему она не применяется?
EDIT: Я видел ошибку, о которой упоминает @Lucky Chingi. Я добавил к моим .htcaccess
следующим строкам:
# BEGIN WordPress
Header add (also tried 'set') Access-Control-Allow-Origin "*"
# END WordPress
Но она по-прежнему не работает ... Любые предложения?
действительно ли консоль показывает любые ошибки 404? Кроме того. .Woff имеет столь широкую поддержку, что я не вижу смысла прикладывать какие-либо другие расширения, кроме woff. –
Похоже, что ваш путь к файлу может быть отключен, используя '../' для поднятия уровня относительно того, где хранится ваш файл css. –
Шрифт от источника «http://smolinaperez.nom.es» был заблокирован от загрузки политикой совместного использования ресурсов Cross-Origin: заголовок «Access-Control-Allow-Origin» присутствует на запрошенном ресурсе. Следовательно, для источника http://ginsandtonics.es 'не разрешен доступ. - на консоли Chrome Dev –