Свойство POSITION
| Браузер | Internet Explorer | Firefox | Mozilla | Opera | Netscape | Safari | |||||||
| Версия | 5.5 | 6.0 | 7.0 | 1.0 | 2.0 | 1.7 | 7.0 | 8.0 | 9.0 | 6.0 | 7.0 | 8.0 | 1.0 |
| Поддержка | Част. | Част. |  |
|
|
|
|
|
|
|
|
|
|
Част. - Поддерживается частично.
Краткая информация
| CSS | CSS2 |
| Значение по умолчанию | static |
| Наследование | Да |
| Применяется | Ко всем элементам, за исключением генерируемых |
| Аналог HTML | Нет |
| Ссылка на спецификацию | http://www.w3.org/TR/CSS21/visuren.html#propdef-position |
Описание
Задает способ позиционирования элемента относительно окна браузера или других объектов на web-странице.
Синтаксис
Аргументы
| absolute | Указывает, что элемент абсолютно позиционирован. В данном случае он не существует в обычном потоке документа подобно другим элементам, которые отображаются на web-странице словно абсолютно позиционированного объекта и нет. Положение элемента задается атрибутами left, top, right и bottom относительно края окна браузера. |
| fixed | По своим свойствам это значение аналогично аргументу absolute, но в отличие от него привязывается к указанной параметрами left, top, right и bottom точке на экране и не меняет своего положения даже при пролистывании web-страницы. Браузеры Netscape, Mozilla и Firefox вообще не отображают полосы прокрутки, если положение элемента задано фиксированным, и оно не помещается целиком в окно браузера. В браузере Opera хотя и показываются полосы прокрутки, но они никак не влияют на позицию элемента. Internet Explorer 6 и ниже не поддерживает данный аргумент. |
| relative | Положение элемента устанавливается относительно его исходного места. Добавление атрибутов left, top, right и bottom изменяет позицию элемента и сдвигает его в ту или иную сторону от первоначального расположения, в зависимости от применяемого параметра. |
| static | Элементы отображаются как обычно. Использование параметров left, top, right и bottom не приводит к каким-либо результатам. |
Пример
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>position</title>
<body>
<div style="font-family: Times, serif; font-size: 200%">
T<span style="position: relative; top: 10px">E</span>X и L<span style="position: relative; top: -5px; font-size: 80%">A</span>T<span style="position: relative; top: 10px">E</span>X
</div>
</body>
</html>