«Единственный способ творить великие дела – это любить то, что ты делаешь»
HTML



Далее на странице



Тег <br> используется для переноса строки. Располагается в том месте текста, где необходим перенос.

Тег <br> не добавляет пустой отступ перед строкой, в отличие от тега <p>.

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

Не имеет


Атрибут Clear

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

Значение/я атрибута:

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

Значение по умолчанию:
none
Пример
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title> Тег br </title>
</head>
<body>

<p> 1. Меня тревожила судьба восемнадцати человек, скрывавшихся где то за горизонтом, в то время как на нас медленно надвигались черные громады туч. <img src="penguin.gif" align="right"> Но Волка Ларсена это, по видимому, не особенно беспокоило, хотя, когда мы вышли на палубу, я заметил, что у него слегка раздуваются ноздри и движения стали быстрее. Лицо его было сурово и жестко, но глаза – ясно голубые в тот день – как то особенно поблескивали. Меня поразило, что Ларсен был весел – свирепо весел, словно он радовался предстоящей борьбе, ликовал в предвкушении великой минуты, когда стихии обрушатся на него. </p>
<p> 2. Меня тревожила судьба восемнадцати человек, скрывавшихся где то за горизонтом, в то время как на нас медленно надвигались черные громады туч. <img src="penguin.gif" align="right"> <br> Но Волка Ларсена это, по видимому, не особенно беспокоило, хотя, когда мы вышли на палубу, я заметил, что у него слегка раздуваются ноздри и движения стали быстрее. Лицо его было сурово и жестко, но глаза – ясно голубые в тот день – как то особенно поблескивали. Меня поразило, что Ларсен был весел – свирепо весел, словно он радовался предстоящей борьбе, ликовал в предвкушении великой минуты, когда стихии обрушатся на него. </p>
<p> 3. Меня тревожила судьба восемнадцати человек, скрывавшихся где то за горизонтом, в то время как на нас медленно надвигались черные громады туч. <img src="penguin.gif" align="right"> <br clear="right"> Но Волка Ларсена это, по видимому, не особенно беспокоило, хотя, когда мы вышли на палубу, я заметил, что у него слегка раздуваются ноздри и движения стали быстрее. Лицо его было сурово и жестко, но глаза – ясно голубые в тот день – как то особенно поблескивали. Меня поразило, что Ларсен был весел – свирепо весел, словно он радовался предстоящей борьбе, ликовал в предвкушении великой минуты, когда стихии обрушатся на него. </p>

</body>
</html>
Результат

1. Меня тревожила судьба восемнадцати человек, скрывавшихся где то за горизонтом, в то время как на нас медленно надвигались черные громады туч. Но Волка Ларсена это, по видимому, не особенно беспокоило, хотя, когда мы вышли на палубу, я заметил, что у него слегка раздуваются ноздри и движения стали быстрее. Лицо его было сурово и жестко, но глаза – ясно голубые в тот день – как то особенно поблескивали.

2. Меня тревожила судьба восемнадцати человек, скрывавшихся где то за горизонтом, в то время как на нас медленно надвигались черные громады туч.
Но Волка Ларсена это, по видимому, не особенно беспокоило, хотя, когда мы вышли на палубу, я заметил, что у него слегка раздуваются ноздри и движения стали быстрее. Лицо его было сурово и жестко, но глаза – ясно голубые в тот день – как то особенно поблескивали.

3. Меня тревожила судьба восемнадцати человек, скрывавшихся где то за горизонтом, в то время как на нас медленно надвигались черные громады туч.
Но Волка Ларсена это, по видимому, не особенно беспокоило, хотя, когда мы вышли на палубу, я заметил, что у него слегка раздуваются ноздри и движения стали быстрее. Лицо его было сурово и жестко, но глаза – ясно голубые в тот день – как то особенно поблескивали.

Пояснение к примеру

Как видно из примера:

- в первом случае текст обтекает плавающий элемент (изображение пингвина, размещенное в правой части экрана) слева;

- во втором варианте мы производим перенос строки при помощи тега <br>, и текст также обтекает плавающий элемент слева.

- и в третьем варианте мы добавляем к тегу <br> атрибут clear="right", таким образом отменяя обтекание плавающего элемента (пингвина), расположенного справа, а текст, расположенный после тега <br>, смещается ниже пингвина.





Все теги HTML

HTML по шагам

Тематические публикации

Тематические публикации