Подключение нескольких стилей одного шрифта в разных файлах

На входе у нас имеется один шрифт, но его стиливое начертание font-style:normal|italic или ширина font-wieght:normal|bold созданы в отдельных файлах.

Наша задача подключить этот шрифт весь и правильно.

Складываем все начертания в одну папку для удобства.

А дальше привожу пример, из которого все станет ясно:

@font-face {
 font-family: "MyriadPro";
 src: url("../fonts/MyriadProCondRegular.eot");
 src: url("../fonts/MyriadProCondRegular.eot?#iefix") format("embedded-opentype"),
      url("../fonts/MyriadProCondRegular.woff") format("woff"),
      url("../fonts/MyriadProCondRegular.ttf") format("truetype"),      
      url("../fonts/MyriadProCondRegular.otf") format("opentype");
 font-weight: normal;
 font-style: normal;
}

@font-face {
 font-family: "MyriadPro";
 src: url("../fonts/MyriadProCondItalic.eot");
 src: url("../fonts/MyriadProCondItalic.eot?#iefix") format("embedded-opentype"),
      url("../fonts/MyriadProCondItalic.woff") format("woff"),
      url("../fonts/MyriadProCondItalic.ttf") format("truetype"),      
      url("../fonts/MyriadProCondItalic.otf") format("opentype");
 font-weight: normal;
 font-style: italic;
}

@font-face {
 font-family: "MyriadPro";
 src: url("../fonts/MyriadProCondBold.eot");
 src: url("../fonts/MyriadProCondBold.eot?#iefix") format("embedded-opentype"),
      url("../fonts/MyriadProCondBold.woff") format("woff"),
      url("../fonts/MyriadProCondBold.ttf") format("truetype"),      
      url("../fonts/MyriadProCondBold.otf") format("opentype");
 font-weight: bold;
 font-style: normal;
}

@font-face {
 font-family: "MyriadPro";
 src: url("../fonts/MyriadProCondBoldItalic.eot");
 src: url("../fonts/MyriadProCondBoldItalic.eot?#iefix") format("embedded-opentype"),
      url("../fonts/MyriadProCondBoldItalic.woff") format("woff"),
      url("../fonts/MyriadProCondBoldItalic.ttf") format("truetype"),      
      url("../fonts/MyriadProCondBoldItalic.otf") format("opentype");
 font-weight: bold;
 font-style: italic;
}

Структура файлов у меня для примера:

/css/файлы_стилей
/fonts/файлы_шрифтов

Заметили ошибку, можете подсказать еще что-то? - Обращаемся сюда

Примеры работ

Информация