Есть ли способ исправить объявления fonts.com @ font-face?

Многие популярные шрифты, похоже, доступны для использования в Интернете исключительно с http://webfonts.fonts.com/

Однако, это работает очень странно. Они не дают вам прямых URL-адресов шрифтов, вместо этого они предоставляют вам файл CSS, который ссылается на файлы шрифтов. Я думаю, что URL-адреса шрифтов в CSS, вероятно, временны и меняются со временем, чтобы предотвратить несанкционированное использование. Так что вы должны использовать их CSS, вы не можете напрямую включать URL-адреса файлов шрифтов (насколько я знаю).

CSS, в свою очередь, не то, что я думаю. Вместо (упрощенно):

@font-face { 
  font-family: "Foo";
  font-weight: bold;
  src: url("foo-bold-variant.ttf");
}

@font-face {
  font-family: "Foo";
  font-weight: normal;
  src: url("foo-normal-variant.ttf");
}

Это:

@font-face { 
  font-family: "Foo Bold";
  src: url("foo-bold-variant.ttf");
}

@font-face {
  font-family: "Foo Normal";
  src: url("foo-normal-variant.ttf");
}

В результате вы не можете этого сделать:

body {
  font-family: "Foo", sans-serif;
}

Вместо этого, где бы вы ни использовали font-weight: bold , вы должны изменить это к семейству шрифтов : «Foo Bold» , плюс, я полагаю, вам нужно добавить правила CSS, чтобы изменить семейство таких вещей, как . Я использую полужирный шрифт в качестве примера, но та же проблема возникает для font-style в дополнение к font-weight .

Они объясняют это как обходной путь для ошибки iOS («это особенность!»): http://blog.fonts.com/2010/09/23/getting-web-fonts-to-look-fantastic-on-iphone-and-ipad-devices/

Но эта ошибка была исправлена ​​в iOS 4.2: http://blog.typekit.com/2010/12/06/updates-to-typekits-mobile-support/

С этой настройкой, если я чего-то не упускаю, я не могу использовать третий -party CSS или сценарии, которые пытаются использовать font-weight , потому что подход fonts.com полностью нарушает свойства CSS font-weight и font-style . Вместо использования font-weight вам нужно создать собственный класс CSS для «mybold» или чего-то подобного, чтобы установить для семейства font-family значение «Foo Bold». т.е. они нарушают стандартный CSS. (Что мне не хватает?)

Может, когда-нибудь это исправят. Но тем временем, может ли кто-нибудь придумать разумный обходной путь? Невозможно определить семейство «Foo» с точки зрения их «Foo Bold» и т. Д. @ font-face определения есть? Напишите какой-нибудь сумасшедший JavaScript, чтобы извлекать URL-адреса из их CSS на лету, а затем динамически определять свой собственный @ font-face?

(«использовать другой шрифт с другой службой» не считается ответом ;-) да, у меня есть подумал об этом, но мне интересно, есть ли способ «исправить» webfonts.fonts.com, настроив их CSS с моими собственными правилами CSS или JavaScript.)

12
задан Havoc P 28 April 2011 в 20:57
поделиться