Свойство font в CSS

  • Предыдущая страница float
  • Следующая страница @font-face

Определение и использование

Сокращенный атрибут font устанавливает все свойства шрифта в одном заявлении.

Комментарии:Этот атрибут также имеет шестой значение: "line-height", позволяющее установить интервал строк.

Объяснение

Эта сокращенная свойство используется для одновременного установления двух или более аспектов шрифта элемента. Использование ключевых слов, таких как icon, позволяет适当地 настроить шрифт элемента, чтобы он соответствовал определенному аспекту окружения компьютера пользователя. Обратите внимание, что если не используются эти ключевые слова, по крайней мере, необходимо указать размер шрифта и семейство шрифтов.

Свойства можно указывать в следующем порядке:

Можно не указывать некоторые значения, например, font:100% verdana; также допускается. Не указанные свойства будут использовать значения по умолчанию.

См. также:

Уроки CSSШрифты CSS

Руководство по HTML DOMСвойство font

Пример

Настройка всех свойств шрифта в одном заявлении:

p.ex1
  {
  font:italic arial,sans-serif;
  }
p.ex2
  {
  font:italic bold 12px/20px arial,sans-serif;
  }

Попробуйте сами

CSS синтаксис

font: font-style font-variant font-weight font-size/line-height font-family|caption|icon|menu|message-box|small-caption|status-bar|initial|inherit;

Значение свойства

Значение Описание
font-style Определяет стиль шрифта. См. также:font-style Возможные значения.
font-variant Определяет альтернативный шрифт. См. также:font-variant Возможные значения.
font-weight Определяет толщину шрифта. См. также:font-weight Возможные значения.
font-size/line-height Определяет размер шрифта и высоту строки. См. также:font-size и line-height Возможные значения.
font-family Определяет семейство шрифтов. См. также:font-family Возможные значения.
caption Определяет шрифт, используемый в заголовочных контролах (например, кнопки, выпадающие списки и т.д.).
icon Определяет шрифт, используемый в иконках.
menu Определяет шрифт, используемый в выпадающих списках.
message-box Определяет шрифт, используемый в диалоговых окнах.
small-caption Маленькая версия шрифта "caption".
status-bar Определяет шрифт, используемый в строке состояния окна.

Технические детали

Значение по умолчанию: не указано
Ингеритация: да
Версия: CSS1
JavaScript синтаксис: object.style.font="italic small-caps bold 12px arial,sans-serif"

Пример TIY

Все свойства шрифта в одном заявлении
Этот пример демонстрирует, как с помощью сокращенных свойств установить свойства шрифта в одном заявлении.
Настройка шрифта абзаца с использованием значения "caption"
Этот пример демонстрирует, как установить шрифт абзаца с использованием значения "caption".

Поддержка браузерами

Числа в таблице указывают на первую версию браузера, которая полностью поддерживает этот атрибут.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5
  • Предыдущая страница float
  • Следующая страница @font-face