Обтікання блоку тексту

Під обтіканням блоку текстом розуміють той же ефект, який можна реалізувати для графіки, коли картинка не розриває блок тексту, а вбудовується в нього. Текст у цьому випадку "обтікає" картинку з одного боку - там, де є вільне поле між межею сторінки (елементу) і картинкою. Обтікання картинки текстом від звичайного вбудовування картинки в текст документа відрізняється тим, що вздовж вертикальної кордону картинку розташовується кілька рядків тексту, а не одна.

Обтіканням блоку тексту іншим текстом керують два атрибути CSS: float і clear.

Атрибут float визначає "плаваючий" блок тексту. Він може приймати значення:

left - блок притиснутий до лівої кордоні охоплює елемента;

right - блок притиснутий до правої межі охоплює елемента;

both - текст може обтікати блок з обох сторін.

Проілюструвати обтікання дозволяє наступний приклад:

Рис. 9.10.

При використанні значення right блок тексту буде притиснутий вправо.

Рис. 9.11.

Другий атрибут опису стилів clear дозволяє управляти власне обтіканням. Він не допускає наявності "плаваючих" блоків біля блоку тексту. Атрибут може набувати значення: right, left, none, both:

Рис. 9.12.

Інтерпретації clear в різних броузерах може розрізнятися.