0

Подключил на сайт нестандарный шрифт, но работает он только в случае, если шрифт установлен у меня в Windows, можно ли как-то обойти это, чтобы не прибегать к картинке и пользователи могли без проблем видеть данный шрифт?

2 ответа 2

2

Нужно подключить шрифт в CSS вот так:

@font-face {
    font-family: 'myCoolFont'; /* по этому имени мы будем обращаться к шрифтц*/
    src: url('http://domain.com/fonts/font.ttf'); /* URL по которому лежит шрифт */
}

Теперь в определении стилей можно использовать ваш шрифт:

font-family: myCoolFont;

http://htmlbook.ru/css/font-face

1
  • Спасибо, я так и сделал, но работает он только при условии, что у меня в системе есть этот шрифт
    – andreyqin
    26 дек 2013 в 13:21
0

Решил проблему сам. Воспользовался онлайн-генератором шрифтов, для генерации их в разных форматах, чтобы все было кроссбраузерно. В итоге код получился примерно такой:

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

Если кому-то интересно, то вот сервисы, которыми я пользовался:

1) http://www.fontsquirrel.com/tools/webfont-generator
2) http://www.web-font-generator.com/

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

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.