Bagaimanakah Saya Boleh Mengawal Kelegapan DIV Induk Tanpa Menjejaskan Kelegapan DIV Anak?

Mengawal Kelegapan dalam DIV Induk tanpa Memberi Impak kepada DIV Kanak-kanak

Dalam pembangunan web, mencapai kesan ketelusan sambil mengekalkan kejelasan kandungan boleh menjadi mencabar. Satu keperluan biasa ialah menetapkan kelegapan dalam DIV induk tanpa menjejaskan kelegapan DIV anaknya.

Untuk mencapai kesan ini, anda boleh menggunakan sifat kelegapan CSS dalam DIV induk. Dengan menetapkan kelegapan kepada nilai antara 0 dan 1, anda mengawal selia ketelusan kandungan latar belakang dalam DIV induk.

Contoh:

Dalam kod CSS di bawah , kami menetapkan kelegapan DIV induk kepada 0.5, yang membolehkan 50% ketelusan untuk latar belakang imej:

.parent {
  background-image: url(../images/madu.jpg);
  opacity: 0.5;
}

Memelihara Warna DIV Kanak-kanak Semasa Menggunakan Kelegapan

Untuk mengekalkan warna hitam DIV kanak-kanak semasa menetapkan kelegapan dalam DIV induk, gunakan yang berikut Sifat CSS dalam DIV kanak-kanak:

.child {
  color: black;
  background-color: transparent;
}

Dengan menentukan warna latar belakang sebagai lutsinar dalam kanak-kanak DIV, warna teksnya kekal utuh, walaupun dengan kesan ketelusan DIV induk.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengawal Kelegapan DIV Induk Tanpa Menjejaskan Kelegapan DIV Anak?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!