Сокращённое свойство font

В CSS некоторые свойства могут быть сгруппированы вместе с другими свойствами для экономии времени и пространства. Свойство font группирует следующие свойства (именно в таком порядке):

• font-style
• font-variant
• font-weight
• font-size
• line-height
• font-family

Таким образом, вы можете определить шесть свойств через одно единственное:

body { font: italic small-caps bold 16px/1.5 Arial, sans-serif; }

Значения должны быть написаны именно в таком порядке и должна быть косая черта / между font-size и line-height.

Хотя я определил все шесть свойств, только font-size и font-family являются обязательными. Таким образом, можно опустить определение других свойств, если вы намерены сохранить их значения по умолчанию:

body { font: bold 16px/1.5 Arial, sans-serif; }

Поскольку здесь font-style и font-variant не определены, они будут использовать значение по умолчанию normal.

Осторожно! Если вы ранее определили одно из свойств шрифта и используете впоследствии свойство font, то оно перепишет заданные ранее значения.

body { font-size: 16px; line-height: 1.5; }
ul { font: 14px Georgia, serif; }

В этом свойстве font, line-height не было определено, поэтому потеряет значение своего предка 1.5 и вернётся к своему значению по умолчанию (обычно 1.2).

Существуют и другие сокращённые свойства, такие как background, border и margin.

Перейти к заданиям