тк 3 июля праздник (в беларуси), буду не онлайн (по возможности буду отвечать)

Введение в свойство float

Пусть у нас есть див с каким-то длинным текстом. Давайте вставим в начало этого текста картинку:

<div> <img src="img.png" alt=""> длинный текст </div> div { width: 400px; text-align: justify; }

:

Как вы видите, низ картинки располагается на первой строке текста, а остальная часть уходит вверх. Справа от картинки получается большое пустое пространство. Давайте сделаем так, чтобы текст заполнил это пустое пространство. Для этого картинке поставим свойство float в значении left:

<div> <img src="img.png" alt=""> длинный текст </div> div { width: 400px; text-align: justify; } img { float: left; }

:

Итак, теперь картинка плавает слева, а текст обтекает ее соответственно справа. При этом пустое пространство сбоку от картинки исчезло.

Можно заставить картинку плавать не слева, а справа. Для этого float установим в значение right:

<div> <img src="img.png" alt=""> длинный текст </div> div { width: 400px; text-align: justify; } img { float: right; }

:

Возьмите длинный текст. Вставьте в начало текста одну картинку, а в середину - другую. Сделайте так, чтобы первая картинка плавала слева, а вторая - справа.