Устанавливает способ позиционирования элемента относительно окна браузера или других объектов на веб-странице.
CSS синтаксис
position: static | absolute | fixed | relative | initial | inherit;
Возможные значения
Значение | Описание |
---|---|
static | Значение по умолчанию. Элементы отображаются в том порядке, в котором они появляются в потоке документа. |
absolute | Элемент имеет абсолютное позиционирование, при этом другие элементы отображаются словно абсолютно позиционированного элемента в потоке нет. Положение элемента задается свойствами left, top, right и bottom, также на положение влияет значение свойства position родительского элемента. Если у родителя значение position установлено как static или родителя нет, то отсчет координат ведется от края окна браузера. Если у родителя значение position задано как fixed, relative или absolute, то отсчет координат ведется от края родительского элемента. |
fixed | По своему действию это значение близко к absolute, но в отличие от него привязывается к указанной свойствами left, top, right и bottom точке на экране и не меняет своего положения при прокрутке веб-страницы. |
relative | Положение элемента устанавливается относительно его исходного места, таким образом установка свойства "left: 20px" добавит 20 пикселей к левой позиции элемента. |
inherit | Значение наследуется от родительского элемента. |
initial | Устанавливает значение по умолчанию. |
Пример использования
Устанавливаем позиционирование элемента <h2>
h2 {
position: absolute;
left: 100px;
top: 150px;
}