Перезаписать font-weight в @ font-face - PullRequest
Новая
       0

Перезаписать font-weight в @ font-face

4 голосов
/ 02 апреля 2012

В настоящее время я использую @font-face с запасным вариантом для неподдерживаемых браузеров: 

@font-face
{
  font-family: TheSansBlack;
  src: local( TheSansBlack ), url( ../fonts/TheSans_TT9_.woff ) format( 'woff' );
}

font-family: TheSansBlack, Arial, Verdana, Helvetica, sans-serif;

В некоторых случаях запасной вариант должен быть полужирным, поэтому у меня есть несколько обозначений css, таких как: 

#foo
{
  font-family: TheSansBlack, Arial, Verdana, Helvetica, sans-serif;
  font-weight: bold;
}

И поскольку я использую шрифт с именем TheSansBlack, нет необходимости устанавливать font-weight: bold

Но это не сработает: 

@font-face
{
  font-family: TheSansBlack;
  font-weight: normal;
  src: local( TheSansBlack ), url( ../fonts/TheSans_TT9_.woff ) format( 'woff' );
}

Он по-прежнему отображает жирный шрифт, который выглядит некрасиво, потому что он двойным жирным шрифтом с TheSansBlack ... Мне просто нужно установить жирность шрифта для отступления, а не шрифт woff.

РЕДАКТИРОВАТЬ: я тоже пытался без успеха: 

@font-face
{
  font-family: TheSansBlack;
  src: local( TheSansBlack ), url( ../fonts/TheSans_TT9_.woff ) format( 'woff' );

  #foo
  {
    font-weight: normal !important;
  }
}

#foo
{
  font-family: TheSansBlack, Arial, Verdana, Helvetica, sans-serif;
  font-weight: bold;
}

1 Ответ

1 голос
/ 03 апреля 2012

Понял: -)

Мне пришлось явно установить font-weight для жирного шрифта в @ font-face.

Не знаю, почему ...

РЕДАКТИРОВАТЬ: полный пример 

@font-face
{
  src: local( TheSansBlack ), url( ../fonts/TheSans_TT9_.woff ) format( 'woff' );
  font-family: TheSansBlack;
  font-weight: bold;
}

#foo
{
  font-family: TheSansBlack, Arial, Verdana, Helvetica, sans-serif;
  font-weight: bold;
}

Это приводит к нормальному TheSansBlack и жирному Arial / Verdana / Helvetica в старых браузерах.

...