Использование нестандартного шрифта на сайте

27.07.2018

Как изменить шрифт текста сайта на свой.

@font-face { font-family: 'RodchenkoInlineCTTRegular'; src: url('/images/com/soblog/items/98/13849-webfont.eot'); src: url('/images/com/soblog/items/98/13849-webfont.eot?#iefix') format('embedded-opentype'), url('/images/com/soblog/items/98/13849-webfont.woff') format('woff'), url('/images/com/soblog/items/98/13849-webfont.ttf') format('truetype'), url('/images/com/soblog/items/98/13849-webfont.svg#RodchenkoInlineCTTRegular') format('svg'); font-weight: normal; font-style: normal; } p.my_font { font-family: RodchenkoInlineCTTRegular; font-size: 16pt; }

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

p.my_font
{
    font-family: RodchenkoInlineCTTRegular;
}

Правило @font-face позволяет определить настройки шрифтов, а также загрузить специфичный шрифт на компьютер пользователя.

Еще нужно учесть, что далеко не все шрифты можно использовать для вэба (Web Fonts)

Категории: CSS

Использование нестандартного шрифта на сайте

Связанные материалы: