В font-weightимота определя теглото или дебелината, на шрифта и зависи както от наличните шрифтове в рамките на семейството на шрифта или тежести, определена от браузъра.
span ( font-weight: bold; )В font-weightимота приема или ключова дума стойност или предварително определени числена стойност. Наличните ключови думи са:
normalboldbolderlighter
Наличните числови стойности са:
100200300400500600700800900
Стойността на ключовата дума се normalпреобразува в числовата стойност, 400а стойността - boldв 700.
За да видите какъвто и да е ефект, използващ стойности, различни от 400или 700, използваният шрифт трябва да има вградени лица, които съответстват на посочените тегла.
Ако шрифтът има удебелена („700“) или нормална („400“) версия като част от семейството на шрифтовете, браузърът ще използва това. Ако те не са налични, браузърът ще имитира собствената си удебелена или нормална версия на шрифта. Това няма да имитира останалите недостъпни тегла. Често шрифтовете използват имена като „Regular“ и „Light“, за да идентифицират всякакви алтернативни тегла на шрифта.
Следващата демонстрация демонстрира използването на алтернативни стойности на теглото:
Горната демонстрация използва безплатния шрифт Open Sans, вграден с помощта на API на Google Web Fonts. Шрифтът се зарежда с всички налични тегла на шрифта и така, използвайки font-weightсвойството, различните налични тегла се показват, както е описано в текста на всеки абзац. Недостъпните тегла просто показват логически най-близкото тегло.
Общите шрифтове като Arial, Helvetica, Georgia и др. Нямат тежести, различни от 400и 700. Така една и съща демонстрация, показана с един от тези шрифтове, ще показва само две тегла в деветте абзаца.
Използване на по-смели и по-леки ключови думи
Стойностите на ключовата дума bolderи lighterса относителни към изчисленото тегло на шрифта на родителския елемент. Браузърът ще търси най-близкото „по-смело“ или „по-леко“ тегло, в зависимост от наличните в семейството шрифтове, в противен случай той просто ще избере „400“ или „700“, в зависимост от това кое има най-голямо значение.
Дочерните елементи няма да наследят стойностите на ключовите думи „по-смели“ и „по-леки“, а вместо това ще наследят изчисленото тегло.
Поддръжка на браузър
| Chrome | Сафари | Firefox | Опера | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Върши работа | Върши работа | Върши работа | Върши работа | Върши работа | Върши работа | Върши работа |