Prioritas Selektor Keturunan dalam CSS
Dalam semua pelajaran sebelumnya, semua selektor harus menangkap elemen itu sendiri. Dapat terjadi, bahwa satu selektor menangkap sebuah elemen, dan selektor kedua menangkap induk dari elemen tersebut.
Anda sudah tahu bahwa jika induk diberikan, misalnya, warna, maka warna tersebut akan diwariskan ke keturunannya. Namun, jika keturunan juga diberikan warna, maka selektor keturunan akan memiliki prioritas yang lebih tinggi daripada selektor induk.
Ini berarti bahwa selektor tag keturunan mengalahkan kelas induk:
<div class="block">
<p>teks</p>
</div>
.block {
color: red;
}
p {
color: green; /* warna ini yang akan diterapkan */
}
:
Selektor tag keturunan juga mengalahkan identifier induk:
<div id="block">
<p class="text">teks</p>
</div>
#block {
color: red;
}
.text {
color: green; /* warna ini yang akan diterapkan */
}
:
