Что такое z-index в HTML и CSS и что он обозначает?

Ответ от Василий К[активный]
z-index — это свойство CSS, которое определяет порядок наложения элементов друг на друга по оси Z, то есть как бы "глубину" слоя. Представь, что экран — это стопка бумаг: элемент с большим значением z-index ложится поверх элемента с меньшим значением. Например, если у одного блока z-index: 1, а у другого z-index: 10, то второй будет отображаться поверх первого. Важный момент: z-index работает только для элементов, у которых задано позиционирование — position: relative, absolute, fixed или sticky. Для обычных элементов со статичным позиционированием (position: static по умолчанию) это свойство не действует. Значения могут быть положительными, отрицательными или нулём. Отрицательные значения "утапливают" элемент под фон страницы, а большие положительные выводят его на самый передний план. Если у нескольких элементов одинаковый z-index, они накладываются в том порядке, в котором идут в HTML-коде — последний окажется сверху.