Межстрочный интервал в CSS

29.03.2019 at 14:09

Чтобы регулировать межстрочный интервал CSS, необходимо воспользоваться свойством line-height, установив желаемое расстояние между строками в качестве его значения в любой единице измерения. В качестве ориентира для отсчета используется базовая линия шрифта.

Синтаксис свойства

Значение свойства – это число, на которое умножается размер шрифта, и получившаяся цифра являет собой расстояние между строками веб-страницы. Например, если выставить значение 1,5, то это полуторный интервал, а 2 – двойной.
Единицы измерения длины межстрочного интервала бывают абсолютными и относительными. Первые почти не используются в веб-разработке. Это стандартные единицы измерения: сантиметры, миллиметры, дюймы. Вот пример, как это выглядит на практике.

p { line-height: 3in; } /* ширина блока 3 дюйма */
p { line-height: 1.5cm; } /* ширина блока 1.5 сантиметра */
p { line-height: 13mm; } /* ширина блока 13 миллиметров */
p { line-height: 12pt; } /* шрифт 12 пунктов */
p { line-height: 12pc; } /* шрифт 12 пик */

Пункты и пики – это типографские единицы измерения. Первый обозначает 1/72 дюйма, а второй – 1/6. Особое внимание важно обратить на то, что обозначение единицы измерения расстояния между строками пишется сразу после цифры, без пробела.
Использовать абсолютные единицы измерения рекомендуется, только если в дальнейшем страница будет печататься. Важно то, что точно они отображаются только на бумаге. Раньше было требование, что дюймы, сантиметры, миллиметры должны быть идеально точно отображены браузерами. Но технически это реализовать было довольно сложно. Поэтому позднее это требование осталось только для печатных листов.
Есть характерные для веб-разработки относительные единицы измерения длины межстрочного интервала. К ним относятся:

  1. Пиксели. Любая картинка состоит из точек, которые называются пикселями. Это самый простой способ задания размера в веб-страницах. Он используется разработчиками наиболее активно.
  2. em. 1 единица равна величине шрифта.
  3. Проценты.

Эти единицы самые используемые. Есть и другие, но они вряд ли пригодятся для задания межстрочного интервала.