Указание стиля и толщины шрифтов Google

Я использую шрифты Google на нескольких своих страницах и упираюсь в стену, пытаясь использовать различные варианты шрифта. Пример: http://www.google.com/webfonts#QuickUsePlace:quickUse/Family:Open+Sans

Я импортирую три лица: Normal, Bold, ExtraBold с помощью тега ссылки. Нормальное лицо отображается правильно, но я не могу понять, как использовать варианты шрифта в моем CSS.

Я пробовал все следующие атрибуты для font-family, но без кубиков:

• 'Open Sans Bold'
• 'Open Sans 700'
• 'Open Sans Bold 700'
• Open Sans: жирный

Сами документы Google не предлагают особой помощи. Кто-нибудь знает, как мне написать свои правила CSS для отображения этих вариантов?

Они используют обычный CSS.

Просто используйте обычное семейство шрифтов следующим образом:

font-family: 'Open Sans', sans-serif;

Теперь вы решаете, какой «вес» должен иметь шрифт, добавляя

для полужирного

font-weight:600;

для жирного (700)

font-weight:bold;

для особо жирного (800)

font-weight:800;

Подобно этому его резервное доказательство, поэтому, если шрифт Google «не сработает», ваш резервный шрифт Arial / Helvetica (Sans-serif) используйте тот же вес, что и шрифт Google.

Довольно умный :-)

Обратите внимание, что разные веса шрифтов должны быть специально импортированы через URL-адрес тега ссылки (параметр семейного запроса URL-адреса шрифта Google) в заголовке.

Например, следующая ссылка будет включать веса 400 и 700:

<link href='fonts.googleapis.com/css?family=Comfortaa:400,700'; rel='stylesheet' type='text/css'>

Вот проблема: вы не можете указать веса шрифта, которых нет в наборе шрифтов от Google. Щелкните ссылку ПОСМОТРЕТЬ ОБРАЗЕЦ под шрифтом, затем прокрутите вниз до раздела СТИЛИ. Там вы увидите каждый из «стилей», доступных для этого конкретного шрифта. К сожалению, Google не перечисляет веса шрифтов CSS для каждого стиля. Вот как имена сопоставляются с номерами веса шрифта CSS:

Thin            100     
Extra Light     200
Light           300
Regular         400
Medium          500
Semi-Bold       600
Bold            700
Black           900

Обратите внимание, что очень немногие шрифты имеют все 9 весов.

font-family:'Open Sans' , sans-serif;

Для света: font-weight : 100; Или font-weight : lighter;

Для нормального: font-weight : 500; Или font-weight : normal;

Для жирного: font-weight : 700; Или font-weight : bold;

Для более смелых: font-weight : 900; Или font-weight : bolder;

вы можете использовать значение веса, указанное в Google Fonts.

body{
 font-family: 'Heebo', sans-serif;
 font-weight: 100;
}