CSS-свойство `line-height-step`

Экспериментальная функция: Это экспериментальная технология
Перед использованием в рабочей среде внимательно изучите таблицу совместимости с браузерами.

CSS-свойство line-height-step задаёт единицу шага для высоты строковых блоков. Если это свойство задано, высота строкового блока округляется вверх до ближайшего значения, кратного этой единице.

Синтаксис

/* Point values */
line-height-step: 18pt;

/* Global values */
line-height-step: inherit;
line-height-step: initial;
line-height-step: revert;
line-height-step: revert-layer;
line-height-step: unset;

Значения

Это свойство задаётся следующим значением:

<length>: Указанная <length> используется при вычислении шага высоты строкового блока.

Формальное определение

Исходное значение	0
Применяется к	блочным контейнерам
Наследуется	да
Вычисленное значение	абсолютная `<length>`
Тип анимации	по типу вычисленного значения

Формальный синтаксис

line-height-step = 
  <length>

Примеры

Задание единицы шага для высоты строкового блока

В следующем примере высота строкового блока в каждом абзаце округляется вверх до единицы шага. Строковый блок в <h1> не помещается в одну единицу шага и поэтому занимает две, но при этом располагается по центру этих двух единиц шага.

:root {
  font-size: 12pt;
  --my-grid: 18pt;
  line-height-step: var(--my-grid);
}
h1 {
  font-size: 20pt;
  margin-top: calc(2 * var(--my-grid));
}

Результат применения этих правил показан на следующем снимке экрана:

How the line-height-step property affects the appearance of text.

Спецификации

В настоящее время ни один браузер не поддерживает эту функцию.

Совместимость с браузерами

См. также

© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/line-height-step