<br> - элемент переноса строки

Интерактивный пример

<p>
  O’er all the hilltops<br />
  Is quiet now,<br />
  In all the treetops<br />
  Hearest thou<br />
  Hardly a breath;<br />
  The birds are asleep in the trees:<br />
  Wait, soon like these<br />
  Thou too shalt rest.
</p>

p {
  font-size: 1rem;
  font-family: sans-serif;
  margin: 20px;
}

Как мы видим из примера выше, элемент <br> поставлен в том месте, где мы хотим перенести строку. Текст после <br> начинается со следующей строки текстового блока.

Атрибуты

Этот элемент включает в себя глобальные атрибуты.

Устаревшие атрибуты

clear

Определяет, где начинается следующая строка после перевода строки.

Стилизация с CSS

Элемент <br> имеет единственную цель – создать разрыв линии в блоке текста. Таким образом, он не имеет размеров или визуального стиля как такового. Есть всего несколько свойств, которые вы можете стилизовать.

Вы можете установить значение margin на <br> чтобы увеличить расстояние между линиями в блоке, но это плохая практика – лучше использовать свойство line-height для этой цели.

Примеры

Простой br

В следующем примере мы используем элемент <br> для разрыва линий в почтовом адресе:

Mozilla<br />
331 E. Evelyn Avenue<br />
Mountain View, CA<br />
94041<br />
USA<br />

Результат будет выглядеть так:

Доступность

Разделять абзацы в тексте, используя <br> не только плохая практика, но и проблема для людей, которые используют программы чтения с экрана. Программы чтения могут сообщать о наличии элемента, но не содержимом в <br>. Это может привести к путанице и разочарованию для человека, использующего программу чтения с экрана.

Техническая сводка

• Категории контента Основной поток, текстовый контент.
• Разрешённое содержимое Отсутствует, это пустой элемент.
• Пропуск теговДолжен иметь открывающий тег, но не закрывающий тег. В XHTML документах элемент пишется как <br />.
• Допустимые родительские элементы Любой элемент, который поддерживает текстовый контент.
• Интерфейс DOM HTMLBRElement

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

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

Смотрите также

• Элемент <address>
• Элемент <p>