Określanie stylu i grubości czcionek Google

Używam czcionek Google na kilku moich stronach i próbuję użyć różnych odmian czcionki. Przykład: http://www.google.com/webfonts#QuickUsePlace:quickUse/Family:Open+Sans

Importuję trzy twarze, Normal, Bold, ExtraBold za pomocą tagu łącza. Normalna twarz wyświetla się poprawnie, ale nie mogę wymyślić, jak używać wariantów czcionki w moim CSS

Wypróbowałem wszystkie poniższe atrybuty dla rodziny czcionek, ale bez kości:

• „Open Sans Bold”
• „Open Sans 700”
• „Open Sans Bold 700”
• „Open Sans: Bold”

Same dokumenty Google nie oferują dużej pomocy. Czy ktoś ma pomysł, jak mam napisać moje reguły CSS, aby wyświetlić te warianty?

Używają zwykłego CSS.

Po prostu użyj swojej zwykłej rodziny czcionek w następujący sposób:

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

Teraz decydujesz, jaką „wagę” powinna mieć czcionka, dodając

dla średnio pogrubionych

font-weight:600;

dla pogrubienia (700)

font-weight:bold;

dla bardzo pogrubionego (800)

font-weight:800;

W ten sposób jest to dowód awaryjny, więc jeśli czcionka google „zawiedzie”, czcionka zapasowa Arial / Helvetica (Sans-serif) będzie miała taką samą grubość jak czcionka Google.

Całkiem sprytnie :-)

Zwróć uwagę, że różne grubości czcionek muszą być specjalnie zaimportowane za pośrednictwem adresu URL tagu linku (parametr zapytania rodziny adresu URL czcionki Google) w nagłówku.

Na przykład poniższy link będzie zawierał zarówno wagi 400, jak i 700:

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

Oto problem: nie możesz określić grubości czcionek, których nie ma w zestawie czcionek Google. Kliknij link ZOBACZ WZÓR znajdujący się pod czcionką, a następnie przewiń w dół do sekcji STYLE. Zobaczysz tam wszystkie „style” dostępne dla tej konkretnej czcionki. Niestety Google nie podaje grubości czcionek CSS dla każdego stylu. Oto jak nazwy są mapowane na numery grubości czcionek CSS:

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

Zwróć uwagę, że bardzo niewiele czcionek ma wszystkie 9 grubości.

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

Dla światła: font-weight : 100; Or font-weight : lighter;

Dla normalnych: font-weight : 500; Or font-weight : normal;

Pogrubienie: font-weight : 700; Or font-weight : bold;

Aby uzyskać odważniejsze: font-weight : 900; Or font-weight : bolder;

możesz użyć wartości wagi określonej w czcionkach Google.

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