Adakah CSS :not() Menyasarkan Elemen Keturunan Jauh secara Selektif?

elemen sepadan dengan kriteria :not(p) dan warnanya ditetapkan kepada merah. Selepas itu,

elemen mewarisi warna ini daripada induknya

.

Gelagat yang Dijangka lwn. Gelagat Sebenar

Anda menjangkakan

elemen untuk kekal tidak terjejas oleh pemilih :not(), tetapi ia mewarisi perubahan warna. Ini bukan tingkah laku yang dimaksudkan untuk menyasarkan keturunan yang jauh.

Penyelesaian

Untuk menggayakan secara khusus hanya

elemen dalam

, anda harus menggunakan pemilih yang lebih langsung:

div p {
    color: black;
}

Salin selepas log masuk

Peningkatan dalam Pemilih CSS Tahap 4

Pemilih CSS Tahap 4 mencadangkan pelanjutan : not() untuk menerima pemilih kompleks dengan penggabung. Ini akan membolehkan anda menyasarkan keturunan jauh dengan fleksibiliti yang lebih besar. Setelah dilaksanakan, anda boleh menulis pemilih seperti:

p:not(div p) {
    color: red;
}

Salin selepas log masuk

Pemilih ini akan menyasarkan semua

unsur yang bukan keturunan langsung

.

Atas ialah kandungan terperinci Adakah CSS :not() Menyasarkan Elemen Keturunan Jauh secara Selektif?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber：php.cn

Artikel sebelumnya：Bagaimanakah Saya Boleh Membuat Saiz Imej Secara Responsif dengan Hanya CSS? Artikel seterusnya：Bagaimana untuk Sentiasa Memaparkan Bar Skrol Menegak dalam Pelayar WebKit?

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel terbaru oleh pengarang

Isu terkini

function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...

daripada 2024-04-29 11:01:01

0

3

2166

Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?

daripada 2024-04-23 00:22:19

0

11

2315

Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.

daripada 2024-04-19 15:37:47

0

1

1950

Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...

daripada 2024-04-18 23:52:34

0

1

1829

Di manakah perisian kursus tentang pemetaan minda CSS? Perisian kursus

daripada 2024-04-16 10:10:18

0

0

1880

Topik-topik yang berkaitan

Lagi>

• Bagaimana untuk memasukkan audio ke dalam ppt
• Penggunaan fungsi fscanf
• Bagaimana untuk menyembunyikan alamat IP pada TikTok
• Muat turun E-O Exchange
• Pengesyoran kedudukan perisian pengesanan perkakasan komputer
• Pengenalan kepada arahan biasa postgresql
• index.html apa itu
• Bagaimana untuk menyambung vb untuk mengakses pangkalan data