Танзими чойгирии элементҳо дар меҳвари Z дар CSS

Тартиби чойгирии элементҳоро метавон бо воситаи хосияти z-index танзим кард, ки қиматҳои он ададҳои бутуни мусаббат ё манфӣ, ё сифр мебошанд. Хосият фақат барои элементҳое кор мекунад, ки қимати хосияти position онҳо ба таври absolute, fixed ё relative муайян карда шудааст.

Ҳангоми истифодаи ин хосият, қоидаи чойгирии элементҳо ба ин шакл аст: элементе, ки қимати z-index-и он зиёдтар аст, болотар ҷойгир мешавад.

Биёед тартиби чойгирии элементҳоро аз мисоли гузашта тағир диҳем. Барои ин, ба элементи якум z-index-и зиёдтар аз элементи дуюм таъин мекунем, масалан, ба ин шакл:

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

Натиҷаи иҷрои рамз:

Задание 1

Саҳифаро ба ин намуна такрор кунед:

Задание 2

Саҳифаро ба ин намуна такрор кунед: