Рэгуляванне накладання элементаў па восі Z у CSS

Парадак накладання элементаў можна рэгуляваць з дапамогай уласцівасці z-index, якая прымае сваім значэннем цэлыя дадатныя або адмоўныя лікі, альбо нуль. Уласцівасць працуе толькі для элементаў, у якіх значэнне position зададзена як absolute, fixed ці relative.

Пры выкарыстанні гэтай уласцівасці правіла накладання элементаў наступнае: вышэй будзе той элемент, у якога значэнне z-index больш.

Давайце зменім парадак накладання элементаў з папярэдняга прыкладу. Для гэтага першаму элементу паставім z-index больш, чым у другога, напрыклад, вось так:

css#elem1 {
  z-index: 2;
}
#elem2 {
  z-index: 1;
}

Вынік выканання кода:

Задание 1

Паўтарыце старонку па дадзеным узоры:

Задание 2

Паўтарыце старонку па дадзеным узоры: