Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Позиционирование : top

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

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

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


Содержание

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

Задает верхнюю позицию объекта, то есть расстояние от верхнего края элемента до верхнего края его родительского объекта.

Синтаксис

HTML { top : sPosition }
Скрипты [ sPosition = ] object.style.top

Используемые значения

sPosition
Строка, которая может определять и принимать от одно из следующих значений:
auto
Значение по умолчанию. Позиция элемента определяется по умолчанию в зависимости от разметки страницы.
length
Задается вещественным числом, выраженным в абсолютных (cm, mm, in, pt или pc) или относительных (em, ex или px) единицах измерения.
percentage
Числовое значение, выраженное в процентах (%). Процентное отношение высчитывается от ширины родительского объекта.

Это свойство читается/записывается для всех объектов, кроме currentStyle (только чтение). Значением по умолчанию является auto. Атрибут Каскадных таблиц стилей (CSS) не наследуется.

Замечания

Вы можете использовать атрибут top только тогда, когда задан атрибут position. Иначе, значение атрибута top проигнорируется.

Значение свойства top является строковым, поэтому его нельзя использовать в вычислениях. Вместо него применяйте значения свойств pixelTop или posTop.

В качестве родительского элемента для объекта может выступать окно браузера.

Примеры

В следующих примерах используются атрибут top и свойство top для изменения расположения объекта.

В первом примере задается позиция объекта div.

<DIV STYLE="position:absolute;top:100px">
. . . </DIV>

Во втором примере с помощью скрипта изменяется расположение рисунка на странице, когда происходят события onmouseover и onmouseout (соответственно, наведение курсора мыши на объект и перемещение курсора мыши за границы текущего объекта).

<IMG SRC="cone.jpg" STYLE="position:absolute; 
    top:80px;" onmouseover="this.style.top='100px''"    
    onmouseout="this.style.top='80px'" >

Стандарты

Это свойство описано в Cascading Style Sheets (CSS), Level 2 (CSS2)

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

Internet Explorer 5.5, 6.0, 7.0, 8.0

Opera 7.0, 8.0, 9.2, 9.5, 9.6, 10.0

Safari 1.3, 2.0, 3.1

Firefox 1.5, 2.0, 3.0, 3.5

Смотри также

pixelTop, posTop

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

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

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

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