CSS: @ font-face импорт не работает

Я не понимаю, как заставить это работать, любая помощь будет оценена по достоинству;CSS: @ font-face импорт не работает

Я иду от того, что я получил с этого сайта: http://alistapart.com/article/cssatten

из моего style.css

@font-face { 
font-family: "JSL"; 
src: url(http://ff.static.1001fonts.net/j/s/jsl-ancient.normal.ttf) format("truetype"); 
} 

font { 
color: #000000; 
font-size: 120%; 
font-family: "JSL"; 
}

источник

2013-02-18 user2084666

Также нет знака плюса (протестирован с моими переименованными шрифтами), и вам не нужно импортировать отдельный файл css в верхней части основного файла css.

Однако вам может потребоваться больше версий шрифта, чем только истинный тип. Посмотрите на Bulletproof @font-face Syntax.

Для этого вы можете использовать FontSquirrel’s generator.

Вот пример встраивания @font-face в мое приложение, которое закреплено в верхней части моей главной таблицы стилей CSS.

@font-face { 
    font-family: 'JustVector'; 
    src: url('../fonts/justvectorv2+webfont.eot'); 
    src: url('../fonts/justvectorv2+webfont.eot?') format('eot'), 
     url('../fonts/justvectorv2+webfont.woff') format('woff'), 
     url('../fonts/justvectorv2+webfont.ttf') format('truetype'), 
     url('../fonts/justvectorv2+webfont.svg#webfontkw9J4lGf') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
}

источник

2013-02-18 20:35:56

Кроме того, проверьте свою консоль, чтобы убедиться, что шрифт, который вы hotlinking, не дает вам Запретить 403, когда вы делаете запрос. –

Я пробовал это, нужно ли это делать на стороне сервера? Потому что это все еще не работает для меня – user2084666

Nevermind, я получил его сейчас! Большое спасибо! – user2084666

нет

@font-face

Попробуйте получить InPort него:

@import_your_new_cssfile.css

whre you put:

font-face { 
font-family: "JSL"; 
src: url(http://www.fontyukle.net/en/DownLoad-JSL+Ancient.ttf) format("truetype"); 
} 

font { 
color: #000000; 
font-size: 120%; 
font-family: "JSL"; 
}

источник

2013-02-18 20:17:32

Возможно, это символ «+» в шрифте URL-адрес проблемы? Возможно, вы захотите, чтобы URL-адрес закодировал его.

Редактировать - после нажатия на URL-адрес шрифта, похоже, что вы должны попытаться загрузить файл ttf и обратиться к нему локально, а не из удаленного источника. Это побуждает меня к Captcha, чтобы загрузить файл, что, вероятно, поэтому не работает.

источник

2013-02-18 20:18:38 Ripside

Я понял это после того, как разместил его, но я изменил ссылку на http://ff.static.1001fonts.net/j/s/jsl-ancient.normal.ttf с тем же результатом – user2084666

Вам необходимо загрузить файл и обратиться к нему локально, Ссылка поддерживается ссылкой для загрузки и требует Captcha для загрузки, что означает, что она НЕ является прямой ссылкой на файл TTF.

источник

2013-02-18 20:33:41

С тех пор обновляюсь ссылка, которая прямо – user2084666

В зависимости от шрифта, который вы, возможно, потребуется использовать:

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

и в CSS:

BODY 
{ 
    font-family: 'someFont', Fallback, sans-serif; 
    font-size: 12px; 
    ... 
}

Это работает для меня, когда у меня были проблемы wityh встраивания пользовательских шрифтов.

источник

2015-01-30 12:35:36

CSS: @ font-face импорт не работает

ответ

Смежные вопросы