Bagaimanakah Kekhususan CSS Berinteraksi dengan Hartanah Diwarisi?

Sifat dan Kekhususan CSS yang diwarisi

Kekhususan warisan CSS telah membingungkan pembangun web. Sifat yang diwarisi, seperti yang diwarisi daripada penggayaan unsur nenek moyang, tidak menjejaskan kekhususan unsur secara langsung. Walau bagaimanapun, interaksi antara sifat yang diwarisi dan sifat yang ditakrifkan secara eksplisit dalam CSS adalah pertimbangan yang penting.

Pertimbangkan coretan HTML berikut:

<h2>This should be black</h2>
<div class="all_red_text">
    <h2>This should be red</h2>
</div>

Jika kami menggunakan CSS berikut:

.all_red_text { color: red; }

Teks "Ini sepatutnya merah" akan bertukar merah, seperti yang dijangkakan. Walau bagaimanapun, jika kita menukar CSS kepada:

h2 { color: black; }
.all_red_text { color: red; }

Semua teks menjadi hitam. Ini adalah kerana pengisytiharan sifat eksplisit, seperti h2 { color: black; }, sentiasa diutamakan daripada harta yang diwarisi.

Pendapat utama ialah kekhususan tidak menentukan keutamaan harta yang diwarisi. Sebaliknya, kehadiran harta yang diisytiharkan secara eksplisit untuk gaya yang sama mengatasi mana-mana harta yang diwarisi. Oleh itu, apabila berurusan dengan harta warisan, adalah penting untuk mempertimbangkan sama ada terdapat sebarang pengisytiharan harta eksplisit yang mungkin bercanggah dengan nilai yang diwarisi.

Atas ialah kandungan terperinci Bagaimanakah Kekhususan CSS Berinteraksi dengan Hartanah Diwarisi?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!