Проблема с шрифтом для Chrome

Question

Я искал переполнение стека, но не смог найти решение в отношении проблем, с которыми я сталкиваюсь ... Я считаю, что многие люди сталкиваются с той же проблемой, но я не уверен, почему их решения не могут работать на моем.

Проблема: Это касается @ font-face.

Код на CSS:

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

}

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

}

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

}



@font-face {
font-family: 'MyriadProBlack';
src: url('fonts/myriadpro-black-webfont.eot');
src: url('fonts/myriadpro-black-webfont.eot?#iefix') format('embedded-opentype'),
     url('fonts/myriadpro-black-webfont.woff') format('woff'),
     url('fonts/myriadpro-black-webfont.ttf') format('truetype'),
     url('fonts/myriadpro-black-webfont.svg#MyriadProBlack') format('svg');
font-weight: normal;
font-style: normal;

}

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

}

Кто-нибудь знает, как заставить это работать для Google Chrome, чтобы мои шрифты вступили в силу?

Answer 1

Попробуйте использовать генератор Font Squirrel Font Face:

http://www.fontsquirrel.com/fontface/generator

Это даст вам все необходимые CSS для каждого возможного браузера.

Answer 2

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

например.

.yourElement {
  font: 30px JaguarJCBold;
}