Шрифт не отображается

Это разные шрифты.

Вам надо каждый из них подгружать.

LEOnidUKG, подскажите как лучше подгрузить через fonts.google или кастомно с размещением шрифтов на сайте?

Для меня легче конечно с помощью fonts.google , есть ли вообще разница как подключить?

Да можете через гугл, просто там галочки нужно на всех выставить.

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

LEOnidUKG, конечно, тормоза на сайте это не дело, попробую подключить, правда первый раз делаю.

Вот только подскажите, скачал я шрифты с fontsquirrel в формате .ttf теперь я должен для каждого начертания подключить в css ? подскажите правильный ли код:

Для regular

@font-face{



font-family: 'Open Sans';



url('../fonts/OpenSans-Regular.ttf') format('truetype'),



font-weight: normal;



font-style: normal;



}

Для Italic

@font-face{



font-family: 'Open Sans';



url('../fonts/OpenSans-Italic.ttf') format('truetype'),



font-weight: normal;



font-style: normal;



}

Ну и так далее для каждого?

Просто я в примере в интернете видел что есть еще файлы .eot и .woff и .svg нужно ли их тоже подключать или только .ttf хватит для корректного отображения?

Вот код который я примером взял:

@font-face{



font-family: 'MyWebFont';



src: url('../fonts/WebFont-Italic.eot');



src: url('../fonts/WebFont-Italic.eot?iefix') format('eot'),



url('../fonts/WebFont-Italic.woff') format('woff'),



url('../fonts/WebFont-Italic.ttf') format('truetype'),



url('../fonts/WebFont-Italic.svg#webfont') format('svg');



font-weight: normal;



font-style: italic;



}

не надо так советовать

нужно писать правильные стили для тех или иных начертаний

Подключаете оба шрифта через font-family: 'Open Sans';

Но только шрифту italic вместо font-style: normal; прописываете font-style: italic;

Так же и с разной толщиной, подключаете через font-family: 'Open Sans'; и пишите к примеру font-weight: 600;

а потом нужным элементам прописать font-weight