0

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

5 ответов 5

2

Где-то недавно задавался подобный вопрос, общая схема такая:

@font-face {
    font-family: DeliciousRoman;
    src: url(http://www.font-face.com/fonts/delicious/Delicious-Roman.otf);
    font-weight:400;
}

p {
    font-family: DeliciousRoman, Helvetica, Arial, sans-serif;
}
1
@font-face {
    font-family: "тут_имя_шрифта";
    src: url("тут_путь_к_шрифту") format('truetype');
}
/*Использовать так*/
font-family: "тут_имя_шрифта";
1

Попробуй Гуглошрифты http://www.google.com/webfonts/ Мануалы и примеры тут: https://developers.google.com/webfonts/docs/getting_started#Quick_Start

0

Можно сделать так: http://htmlbook.ru/css/font-face. Но этот вариант поддерживают не все браузеры. Лучший вариант - использовать стандартные шрифты, которые предустановлены на всех системах (Arial, Verdana и т.п.), иначе гарантий, что сайт у пользователя будет выглядедть как задумано, нет. Ну и в случае небольших заголовков можно заменить текст картинкой (надеюсь, подключить шрифт в фотошоп для вас не проблема). В этом случае страдает SEO, т.к. индексироваться поисковиками такой "текст" не будет.

0

Современные браузеры поддерживают шрифты TTF/OTF/WOFF, но Internet Explorer до версии 9.0 поддерживает только шрифты формата EOT (Embedded OpenType).

Подключение шрифта должно выглядеть как-то так:

/* только для Internet Explorer */
@font-face {
 font-family: open_sanslight;
 src: url('Content/fonts/OpenSans-Light.eot');
}
/* далее для всех остальных браузеров */
@font-face {
 font-family: open_sanslight;
 src: url('Content/fonts/OpenSans-Light.ttf');
}

Ваш ответ

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

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