Как работает свойство line-height

Высота строки (line-height) влияет на вертикальное расстояние между строками текста, что сказывается на читаемости и визуальном восприятии контента.

Основные аспекты:

• Читаемость – слишком маленький line-height делает текст слипшимся, слишком большой – разорванным.
• Верстка – влияет на высоту элементов (height, min-height), особенно при inline и inline-block.
• Выравнивание – критично для вертикального центрирования текста (например, в кнопках).

Пример:

/* Оптимальный line-height ~1.5 для основного текста */
p {
  line-height: 1.5; /* Без единиц – множитель от font-size */
}

/* Фиксированная высота строки */
h1 {
  line-height: 32px;
}

Нюанс:
line-height наследуется, но лучше задавать относительные значения (без px), чтобы адаптировалось при изменении font-size.