Bagaimanakah Saya Boleh Menggayakan Elemen Induk pada Hover Anak Tanpa Menggunakan Pemilih Induk CSS?

Menggayakan Elemen Induk pada Tuding Anak Tanpa Pemilih Induk CSS

Walaupun tiada pemilih ibu bapa yang berdedikasi dalam CSS, anda boleh menggayakan unsur induk berdasarkan keadaan tuding unsur anak. Mari kita pertimbangkan contoh "butang padam" yang menyerlahkan bahagian induknya apabila dilegar.

Satu pendekatan yang berkesan ialah menggunakan pembungkus pseudo. Dengan menetapkan induk kepada pointer-events: none dan mencipta child div dengan pointer-events: auto, kita boleh membezakan antara acara tetikus yang menyasarkan ibu bapa dan anak.

Coretan CSS berikut menunjukkan cara ini boleh dicapai:

div.parent {
  pointer-events: none;
}

div.child {
  pointer-events: auto;
}

div.parent:hover {
  background: yellow;
}

Pendekatan ini membolehkan anda menggayakan elemen induk berdasarkan keadaan tuding elemen anak, walaupun CSS melakukannya tidak mempunyai pemilih ibu bapa yang berdedikasi.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggayakan Elemen Induk pada Hover Anak Tanpa Menggunakan Pemilih Induk CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!