📏 Конвертер высоты строки (line-height)
Конвертируйте абсолютное значение высоты строки в относительные единицы (% и числовое значение) для использования в CSS
📋 Результаты конвертации:
Предпросмотр текста:
Съешь ещё этих мягких французских булок, да выпей чаю.
Антон — наш новый дизайнер, который любит кофе.
В чащах юга жил бы цитрус? Да, но фальшивый экземпляр!
Абсолютное значение
line-height: 24px;
Числовое значение (без единиц)
line-height: 1.5;
Рекомендуется для наследования
Процентное значение
line-height: 150%;
EM значение
line-height: 1.5em;
Аналогично числовому, но с em
🔍 Детали расчета:
Font-size: 16px
Line-height (px): 24px
Соотношение: 24px ÷ 16px = 1.5
Числовое значение: 1.5
Процент: 150%
Готовый CSS код:
.your-element {
font-size: 16px;
line-height: 1.5; /* или 150% */
}
💡 Рекомендации по использованию:
- Числовые значения (без единиц) - лучший выбор для наследования. Дочерние элементы будут использовать своё собственное значение font-size для расчета line-height.
- Процентные значения - рассчитываются от font-size родителя и наследуются как фиксированное значение.
- EM значения - аналогичны процентам, рассчитываются от текущего font-size.
- Для основного текста рекомендуется line-height от 1.4 до 1.6.
- Для заголовков можно использовать меньшие значения (1.1 - 1.3).