CSS · справочник

Свойство line-height

line-height задаёт высоту строки текста. Достаточный интервал помогает глазу переходить на следующую строку и делает длинные материалы заметно удобнее.

Безразмерное значение

Для основного текста удобно число 1.5–1.7. Оно умножается на текущий font-size и корректно наследуется элементами с другим размером шрифта.

body { line-height: 1.6; }
h1 { line-height: 1.05; }

Текст и интерфейс

Крупному короткому заголовку подходит плотный интервал, а абзацу нужен свободный. Для кнопки не используй line-height, равный высоте: многострочный текст сломает центрирование.

.article { max-width: 68ch; }
.article p { line-height: 1.7; }
.button { display: inline-flex; align-items: center; }

Частые ошибки

• Слишком плотный основной текст.
• Фиксированные пиксели при наследовании.
• Центрирование кнопки через line-height.
• Одинаковый интервал у h1 и p.

Связанные темы

font-size · Шрифты · Типографика