Тег

Описание

Тег устанавливает перевод строки в том месте, где этот тег находится. В отличие от тега абзаца , использование тега не добавляет пустой отступ перед строкой. Если текст, в котором используется перевод строки, обтекает плавающий элемент, то с помощью атрибута clear тега можно сделать так, чтобы следующая строка начиналась ниже элемента.

Синтаксис

HTML	Текст<br> текст
XHTML	Текст<br /> текст

Атрибуты

clear

Атрибут clear сообщает браузеру, как обрабатывать следующую строку, если текст обтекает плавающий элемент. Плавающим элементом называется изображение, у которого установлен атрибут align или элемент, к которому применяется стилевое свойство float.

Результат использования clear зависит от края, по которому выравнивается элемент и значения clear. Так, если изображение выравнивается по левому краю, а значение атрибута clear тега установлено как all или left, то текст после тега будет отображаться ниже рисунка. Любые другие значения clear заставят текст располагаться справа от изображения и обтекать его.

<br clear="all | left | right | none">

all: Отменяет обтекание элемента одновременно с правого и левого края.
left: Отменяет обтекание с левой стороны элемента, расположенного после тега .
right: Отменяет обтекание с правой стороны элемента.
none: Отменяет действие атрибута.

Использование этого атрибута осуждается спецификацией HTML, валидный код получается только при использовании переходного <!DOCTYPE>.

Закрывающий тег

Не требуется.

Пример. Использование тега

<!DOCTYPE html>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Тег BR</title>
 </head>
 <body>
  <p>Р.Л. Стивенсон</p>
  <p>Лето в стране настало,<br>
   Вереск опять цветет.<br>
   Но некому готовить<br>
   Вересковый мед.</p>
 </body>
</html>

Пример. Отмена обтекания текста

<!DOCTYPE html>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Тег BR, атрибут clear</title>
 </head>
 <body>
  <div style="float: left; background: #fd0; border: solid 1px black; padding: 10px; width: 40%">
  Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh
  euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.
  </div>
  <br clear="left">
  <p>Duis autem dolor in hendrerit in vulputate velit esse molestie consequat, vel
  illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio
  dignissim qui blandit praesent luptatum zzril delenit au gue duis dolore te
  feugat nulla facilisi.</p>
 </body>
</html>

Браузеры: Настольные Мобильные ?

Internet Explorer	Chrome	Opera	Safari	Firefox
3	1	3.5	1	1

Android	Firefox Mobile	Opera Mobile	Safari Mobile
1	1	6	1

✖

Браузеры

В таблице браузеров применяются следующие обозначения.

— элемент полностью поддерживается браузером;
— элемент браузером не воспринимается и игнорируется;
— при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

Число указывает версию браузреа, начиная с которой элемент поддерживается.

Строчные элементы. | Текст. | Форматирование.

Тег <br>