Основы работы с XHTML и CSS
Обтекание текста вокруг изображений
Когда изображения смещаются влево и вправо на странице, последующий текст будет обтекать изображение. Это иллюстрирует рисунок 5.14, где изображение смещается влево, так что подпись к изображению обтекает его справа. В то же самое время следующий далее параграф также обтекает изображение.
увеличить изображение
Рис. 5.14. Плавающее изображение с обтекающим его текстовым параграфом
Обратите внимание в следующем далее коде для показанного выше вывода, что тег <img/> и заголовок находятся внутри тега <div>, так как для изображения и текста согласно стандартам XHTML требуется блочный контейнер.
<p>Это изображение с заголовком, где изображение смещается влево, а заголовок обтекает его справа.</p>
<div> <img src="book.gif" alt="Изображение книги" style="float:left; margin-right:10px; margin-bottom:10px"/> <b>Figure 1.</b><br/> <i>The Passion of the Western Mind</i>. </div>
<p>Этот следующий далее параграф также обтекает изображение справа, так как он записывается далее в строке ниже заголовка.</p>
Листинг 5.5. Код для плавающего изображения с обтекающим его текстовым параграфом (html, txt)
