Bagaimana untuk Menunjukkan Div Kanak-Kanak Semasa Menyembunyikan Div Induknya dalam CSS?

Cara Memaparkan Div Kanak-Kanak sambil Menyembunyikan Div Induknya

Menyembunyikan div induk sambil mengekalkan keterlihatan elemen anaknya boleh dicapai melalui manipulasi CSS. Begini caranya:

Langkah 1: Sembunyikan Div Induk

.Main-Div {
  display: none;
}

Peraturan CSS ini menyembunyikan div induk dengan kelas "Div Utama."

Langkah 2: Jadikan Div Kanak-kanak Kelihatan

.Main-Div > .Inner-Div {
  visibility: visible;
}

Peraturan ini menyasarkan div kanak-kanak (".Inner-Div") dalam div induk tersembunyi dan menjadikannya kelihatan.

Contoh Penuh

Menggabungkan peraturan ini, kod CSS dan HTML yang terhasil ialah:

.Main-Div {
  display: none;
}

.Main-Div > .Inner-Div {
  visibility: visible;
}

<div class="Main-Div">
  This is some Text..
  This is some Text..
  <div class="Inner-Div">
    <a href="#">
      <img  src="/static/imghwm/default1.png" data-src="/image/pic.jpg" class="lazy" alt="Bagaimana untuk Menunjukkan Div Kanak-Kanak Semasa Menyembunyikan Div Induknya dalam CSS?" >
    </a>
  </div>
  This is some Text..
  This is some Text..
</div>

Dengan menggunakan teknik ini, anda boleh secara selektif memaparkan elemen anak walaupun div induknya disembunyikan.

Atas ialah kandungan terperinci Bagaimana untuk Menunjukkan Div Kanak-Kanak Semasa Menyembunyikan Div Induknya dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!