CSS-свойство z-index

CSS-свойство z-index задает порядок наложения или расположения для позиционированных элементов, то есть элементов, значение position которых является absolute, fixed, или relative. Эти элементы накладываться друг на друга в определенном порядке вдоль условной оси Z, которая перпендикулярна экрану.

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

Когда элементы перекрываются, z-index определяет, какой из них перекрывает другой. Элемент с более высоким значением z-index обычно перекрывает элемент с более низким.

Синтаксис

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

z-index: integer | auto | initial | inherit

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

div {
    position: absolute;
    lop: 30px;
    left: 30px;
    z-index: 2;
}

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

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

Значение	Описание
integer	Устанавливает значение (index) элемента, значение которого будет применяться для перекрывающих друг друга элементов с `position` отличной от `static`. Допускаются отрицательные целочисленные значения.
`auto`	Позиционированные элементы будут накладваться в том порядке, в котором они объявленны в DOM-документе. Это значение установлено по умолчанию.
`initial`	Устанавливает это свойство в значение по умолчанию.
`inherit`	Если указан, связанный элемент принимает вычисленное значение своего родительского элемента `z-index`.