Mengapakah DIV Div1 Pertama Masih Kelihatan Apabila Memberikan Nilai Indeks Z yang Lebih Rendah daripada Div2?

Menggunakan z-index untuk menggantikan DIV

Soalan ini meneroka penggunaan z-index untuk mengawal susunan susunan unsur DIV. Penyoal cuba untuk menggantikan satu DIV (div1) ke atas yang lain (div2) menggunakan indeks-z, tetapi kesan yang diingini tidak tercapai.

Kod yang disediakan termasuk dua elemen DIV dengan nilai indeks-z yang berbeza:

<code class="css">.div1 {
  z-index: 1;
}
.div2 {
  z-index: 2;
}</code>

Walaupun indeks z div2 lebih tinggi, div1 kekal kelihatan di hadapannya. Ini kerana kedudukan elemen tidak ditetapkan secara eksplisit.

Untuk menyelesaikan isu ini, adalah perlu untuk menambah kedudukan: relatif kepada kedua-dua div. Ini mewujudkan konteks tindanan, membolehkan elemen diletakkan secara relatif antara satu sama lain. Kod yang dikemas kini ialah:

<code class="css">.div1 {
  z-index: 2;
  position: relative;
}
.div2 {
  z-index: 1;
  position: relative;
}</code>

Dengan pengubahsuaian ini, div1 akan diletakkan dengan betul di atas div2, kerana nilai indeks-z diutamakan dalam konteks tindanan yang dibuat.

Atas ialah kandungan terperinci Mengapakah DIV Div1 Pertama Masih Kelihatan Apabila Memberikan Nilai Indeks Z yang Lebih Rendah daripada Div2?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!