CSS свойство font-size

Свойство font-size используется для установления размера шрифта текста.

Размер шрифта может быть установлен следующими способами:

  • absolute-size
  • relative-size
  • length
  • percentage

Абсолютный размер шрифта включает в себя следующие значения:

  • xx-small
  • x-small
  • small
  • small
  • x-large
  • xx-large

Относительный размер шрифта включает следующие значения:

  • smaller
  • larger

Различают относительные размеры (em, ex, px) и абсолютные размеры (in, cm, mm, pt, pc). Проценты указывают на абсолютный размер шрифта относительно размера шрифта родительского элемента.

Значение по умолчанию medium
Применяется Ко всем элементам, а также к ::first-letter и ::first-line.
Наследуется Да.
Анимируемое Да
Версия CSS1
DOM синтаксис object.style.fontSize = "15px";

Синтаксис

font-size: medium | xx-small | x-small | small | large | x-large | xx-large | smaller | larger | length | initial | inherit;

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style>
      h1 { font-size: 24pt; }
      h3 { font-size: 26px; }
      p { font-size: 1em; }
      a { font-size: 100%; }
      span { font-size: x-small; }
    </style>
  </head>
  <body>
    <span>Для span использовано значение x-small.</span> 
    <p>Для этого параграфа использован размер шрифта 1em.</p>
    <a href="https://www.w3docs.com/">Для гиперссылки использован раpмер шрифта 100%.</a>
    <h3>Для заголовка использовано значение x-small.</h3>
    <h1>Размер шрифта для заголовка равен 24pt.</h1>
  </body>
</html>

Значения

Значение Описание
medium Устанавливает размер шрифта medium. Значение по умолчанию.
xx-small Устанавливает размер шрифта xx-small.
x-small Устанавливает размер шрифта x-small.
small Устанавливает размер шрифта small.
large Устанавливает размер шрифта large.
x-large Устанавливает размер шрифта x-large.
xx-large Устанавливает размер шрифта xx-large.
smaller Уменьшает размер шрифта.
larger Увеличивает размер шрифта.
length Устанавливает размер шрифта в px, em и т. д.
% Устанавливает размер шрифта в процентах относительно размера шрифта родительского элемента.
initial Устанавливает свойство в значение по умолчанию.
inherit Значение элемента наследуется от родительского элемента.

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

chrome edge firefox safari opera
1.0+ 12.0+ 1.0+ 1.0+ 7+.0

Практикуйте свои знания

What are the ways you can specify font size in CSS according to the content from the provided URL?
Считаете ли это полезным?