Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Расположение и границы : float

смотрим также

Материал из Справочник Web-языков

Перейти к: навигация, поиск


Содержание

Атрибут float | Свойство styleFloat

Это свойство устанавливает с каких сторон будет происходить обтекание объекта.

Синтаксис

HTML { float : sFloat }
Скрипты [ sFloat = ] object.style.styleFloat

Возможные значения

sFloat
Строка, которая может определять и принимать одно из следующих значений:
none Значение по умолчанию. Объекты отображаются в том же порядке, как они идут в тексте.
left Текст обтекает объект с правой стороны.
right Текст обтекает объект с левой стороны

Это свойство не наследуется. Значением по умолчанию является none.

Замечания

Если для свойства объекта заданы значения left или right, то он интерпретируется как блочный объект. Следовательно, для него свойство display будет игнорироваться.

Объекты, которые следуют за обтекаемым объектом, располагаются в соответствии с заданными свойствами обтекания.

Обтекаемый объект перемещается влево или вправо до тех пор пока не достигает границ (bodrer, margin, padding) другого блочного объекта.

Если для объектов div и span задана ширина, то они будут отображаться при использовании атрибута float. В Microsoft Internet Explorer 5 для таких объектов ширина задана по умолчанию, и объекты отображаются в любом случае.

Примеры

Следующие примеры иллюстрируют применение свойства styleFloat и атрибута float для задания различных параметров обтекания объекта.

В первом примере используется атрибут float для задания с какой стороны от текста будут располагаться два рисунка (sphere.jpg будет находиться слева, а cone.jpg справа).

<img src="sphere.jpg" style="float:left">
<img src="cone.jpg" style="float:right">

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

<IMG ID=oSphere SRC="sphere.jpeg" STYLE="float:left">
<IMG ID=oCone SRC="cone.jpeg" STYLE="float:right">
:
<BUTTON onmouseover="oSphere.style.styleFloat='right'; 
    oCone.style.styleFloat='left'"
    onmouseout="oSphere.style.styleFloat='left'; 
    oCone.style.styleFloat='right'">
    Flip-flop images.
</BUTTON> 

Стандарты

Это свойство определено в Cascading Style Sheets (CSS), Level 1 (CSS1).

Поддерживаемые браузеры

Internet Explorer 5.5, 6.0, 7.0, 8.0

Opera 7.0, 8.0, 9.2, 9.5

Safari 1.3, 2.0, 3.1

Firefox 1.5, 2.0, 3.0

Ссылки на источники

http://msdn.microsoft.com/en-us/library/ms533758(VS.85).aspx

https://developer.mozilla.org/en/CSS/float

Добавить страницу в закладки:
РАЗРЕШАЕТСЯ перепечатывать и копировать информацию ТОЛЬКО ПРИ РАЗМЕЩЕНИИ ссылки на оригинал!
(<A href="http://www.spravkaweb.ru/">Справочник Web-языков</A>)
другие проекты
Rambler\'s Top100 Индекс цитирования