Как сделать расстояние между текстом в html

Для создания расстояния между текстом в HTML можно использовать свойство CSS line-height. Оно устанавливает высоту строки текста и может быть задано в пикселях, процентах или других единицах измерения. Например, чтобы установить расстояние между строками в 1.5 раза больше, чем размер шрифта, можно использовать следующий код:

p {
  font-size: 16px; /* размер шрифта */
  line-height: 24px; /* высота строки (1.5 * 16px) */
}

Также можно использовать отступы между абзацами с помощью свойства margin. Например, чтобы создать отступы между абзацами в 10 пикселей, можно использовать следующий код:

p {
  margin-top: 10px; /* отступ сверху */
  margin-bottom: 10px; /* отступ снизу */
}

Кроме того, для создания более сложных макетов можно использовать другие свойства CSS, такие как padding, border, display и т.д.

Расстояние в тексте задают CSS-свойствами. Какое свойство нужно, зависит от того, между чем расстояние.

Между строками

body {
  line-height: 1.6;
}

Число без единиц — множитель размера шрифта: при шрифте 16px строка будет высотой 25,6px. Такое значение правильно наследуется элементами с другим размером шрифта. Для основного текста подходит 1.4–1.7, для заголовков — 1.1–1.3.

Между абзацами

p {
  margin: 0 0 16px;
}

У <p> по умолчанию есть отступы сверху и снизу, равные размеру шрифта. Вертикальные отступы соседних абзацев схлопываются, и остаётся больший.

Пустое место в HTML без CSS

Несколько пробелов подряд HTML схлопывает в один. Варианты:

• <br> — перенос строки внутри абзаца, например в адресе или стихах;
•   — неразрывный пробел, он не схлопывается;
• white-space: pre-wrap у блока — пробелы и переносы сохранятся, как в исходном тексте.

Ставить подряд несколько <br> или   для отступов не стоит: на другом экране вёрстка поплывёт. Используйте margin.

Между элементами в строке

Между иконкой и подписью или двумя кнопками:

.actions {
  display: flex;
  gap: 8px;
}

Оформление текста разбирают в бесплатном курсе «Введение в HTML и CSS».