Using .ttf fonts

gistfile1.txt

Ныне это возможно вполне кроссбраузерно, правда, Интернет Эксплорер требует, чтобы шрифт был в формате EOT, в принципе, в интернете можно найти, я думаю, программы для конвертации TTF в EOT.

Пусть у меня есть некий шрифт, cool_font.ttf для обычного начертания и cool_font_b.ttf для жирного. Переведём эти шрифты в формат EOT, назовём их cool_font.eot и cool_font_b.eot и положим все 4 файла в корень сайта. Тогда CSS-таблица будет выглядеть примерно так:

@font-face {
  font-family: 'cool_font_eot';
  font-weight: normal;
  src: url('/cool_font.eot');
}
@font-face {
  font-family: 'cool_font_eot';
  font-weight: bold;
  src: url('/cool_font_b.eot');
}
@font-face {
  font-family: 'cool_font_ttf';
  font-weight: normal;
  src: url('/cool_font.ttf');
}
@font-face {
  font-family: 'cool_font_ttf';
  font-weight: bold;
  src: url('/cool_font_b.ttf');
}
.cool{
  font-family: 'cool_font_eot', 'cool_font_ttf', 'Monotype Corsiva', serif;
  /* eot для эксплорера-оперы-сафари, ttf для файрфокса,
  Monotype Corsiva для древних браузеров и serif для совсем неадекватных */
}


И потом пишем: <span class="cool">Привет <strong>всем</strong> !</span>

В принципе, так же можно сделать и курсив.