Если я определяю собственный внешний шрифт в css, нужно ли объявлять src для каждого класса, который его использует?

Question

Если я использую внешне загруженный шрифт (например, «MyFont») и он будет использоваться в нескольких классах, нужно ли мне сделать это:

.one { font-family: MyFont; src: url( "fonts/MyFont.ttf" ); }
.two { font-family: MyFont; src: url( "fonts/MyFont.ttf" ); }

или я могу это сделать?

.one { font-family: MyFont; src: url( "fonts/MyFont.ttf" ); }
.two { font-family: MyFont; }

Answer 1

Нет, ознакомьтесь с этой статьей: Новый пуленепробиваемый @ Font-Face Syntax

Добавьте что-то вроде этого в начале вашего CSS-файла:

@font-face {
    font-family: 'MyFontFamily';
    src: url('myfont-webfont.eot?#iefix') format('embedded-opentype'), 
         url('myfont-webfont.woff') format('woff'), 
         url('myfont-webfont.ttf')  format('truetype'),
         url('myfont-webfont.svg#svgFontName') format('svg');
    }

Работая с этим примером кода, остальная часть вашего CSS должна выглядеть примерно так:

.one { font-family: MyFontFamily }
.two { font-family: MyFontFamily }

Answer 2

Вы должны использовать директиву @font-face.

@font-face {
    font-family: MyFont;
    src: url(...);
}

.one { font-family: MyFont; }
.two { font-family: MyFont; }