font
Обновлено: 29.03.2023
font
Универсальное свойство, которое позволяет одновременно задать несколько характеристик шрифта и текста.
Краткая информация
| Значение по умолчанию | Зависит от использования |
| Наследуется | Да |
| Применяется | Ко всем элементам |
| Анимируется | Да |
Синтаксис
font: [font-style||font-variant||font-weight||font-stretch] font-size [/line-height] font-family
Значения
В качестве обязательных значений свойства font указывается размер шрифта и его семейство. Остальные значения являются опциональными и задаются при желании. Для подробного ознакомления смотрите информацию о каждом свойстве отдельно.
Допускается в качестве значения использовать ключевые слова, определяющие шрифт различных элементов операционной системы пользователя.
| caption | Шрифт для текста элементов форм вроде кнопок. |
| icon | Шрифт для текста под иконками. |
| menu | Шрифт применяемый в меню. |
| message-box | Шрифт для диалоговых окон. |
| small-caption | Шрифт для подписей к небольшим элементам управления. |
| status-bar | Шрифт для строки состояния окон. |
Пример
p { font: 12pt/10pt sans-serif; }Из типографики пошла запись указывать через слэш размер шрифта и высоту строки. Поэтому 12pt в данном случае означает размер основного текста в пунктах, а 10pt — высоту строки. В качестве семейства указывается рубленый шрифт (sans-serif).
p { font: bold italic 110% serif; }Значение bold устанавливает жирное начертание текста, а italic — курсивное. В данном случае их порядок не важен, поэтому bold и italic можно поменять местами. Размер текста задаётся в процентах, а в качестве гарнитуры используется шрифт с засечками (serif).
p { font: normal small-caps 12px/14px fantasy; }Значение small-caps принадлежит свойству font-variant и устанавливает текст в виде капители (заглавные буквы уменьшенного размера). Значение normal применяется сразу к двум свойствам: font-style и font-weight.
Объектная модель
Объект.style.font