Указание разных размеров шрифтов для разных семейств шрифтов

Question

Есть ли способ указать другой размер шрифта для другой семьи шрифтов. Шрифт, который я хочу использовать (для целей брендинга продукта), представляет собой несколько редкий шрифт (FlashDLig), который не поддерживается всеми ПК и браузерами. (мой один компьютер с Windows 7 с IE 9 не отображает его ...) Теперь для резервного шрифта я использую Arial, проблема в том, что arial намного больше, чем FlashDLig, поэтому я хочу указать для него другой размер шрифта тот же класс. Является ли это возможным?

Я знаю, что вы, вероятно, можете использовать функцию font-size-adjust, но она поддерживается только в Firefox.

Любые предложения? Возможно, может быть маска Javascript?

Благодаря

Answer 1

Посмотрите на следующие примеры кода:

http://www.lalit.org/lab/javascript-css-font-detect/

и

http://remysharp.com/2008/07/08/how-to-detect-if-a-font-is-installed-only-using-javascript/

и настроить таблицу стилей от результата обнаружения.

Я использовал их некоторое время назад с хорошими результатами.

Удачи вам! :)

Answer 2

Я бы рекомендовал по умолчанию использовать Arial, а затем создать второй класс, который использует шрифт @ font-face, объявленный для вашего шрифта. Тогда я думаю, что вам нужно будет использовать Javascript для проверки того, мог ли шрифт загружаться (возможно, проверить производный стиль какого-либо элемента, который вы выставляете за пределы экрана), и если это так, измените класс на новый. Причина, по которой я буду делать это, вместо того, чтобы начать с вашего пользовательского шрифта, связана с идеей progressive enhancement.

Вот один из способов изменить класс в Javascript:

if (fontLoaded()) { 
    document.body.className += " fontLoaded"; 
} 

И тогда в вашем CSS:

@font-face { 
    ... /* declare font face */ 
} 
body { 
    font-family: "Arial"; 
    font-size: 0.8em; 
} 
body.fontLoaded { 
    font-family: "FlashDLig"; 
    font-size: 1em; 
}