CSS-свойство position указывает, как позиционируется элемент относительно других элементов в документе.

Значение по умолчанию: static
Применяется к: Все элементы
Наследование: Нет
Анимирование: Нет. Анимируемые свойства
Версия: CSS 2, 3

Элементы с position, отличным от static, называются позиционированными (positioned). Их наложение друг на друга определяется свойством z-index.

Синтаксис

Синтаксически свойства задаются по следующему шаблону:

position: static | relative | absolute | fixed | sticky | initial | inherit

Примеры написания кода свойства position:

h1 {
    position: absolute;
    top: 100px;
    left: 150px;
}

Значения свойств

В следующей таблице описаны значения этого свойства.

Значение Описание
static Элементу задется свойство нормального потока, элементы располагаются в том порядке, в котором объявлены в DOM. Это значение установлено по умолчанию.
relative Элемент позиционируется относительно его нормального положения (это называется положением в нормальном потоке).
absolute Элемент позиционируется относительно своего первого родителя, значение позиции которого отличается от static.
fixed Элемент фиксируется относительно области просмотра экрана и не перемещается при прокрутке. При печати элемент печатается на каждой странице.
sticky Элемент расположен аналогично относительно (relative) позиционированного блока, и он «прилипает» (sticks) к ближайшему предку, у которого есть «механизм прокрутки» (scrolling).
initial Устанавливает это свойство в значение по умолчанию.
inherit Если указан, связанный элемент принимает вычисленное значение своего родительского элемента position.

Поддержка браузеров

Свойство position поддерживается во всех основных браузерах.

Читайте также

Похожие посты

CSS-свойство clip

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

CSS-свойство bottom

Задает смещение или отступ от нижнего края элемента

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.