Apakah pemilih lanjutan?

Pemilih lanjutan termasuk pemilih adik beradik bersebelahan, pemilih adik beradik sejagat, pemilih elemen anak, pemilih keturunan, pemilih atribut, :bukan pemilih, pemilih anak ke-nth, : ke-th -pemilih anak terakhir, : ke- of-type selector, :nth-last-of-type selector dan sebagainya. Pengenalan terperinci: 1. Pemilih adik beradik bersebelahan, gunakan simbol "+" untuk memilih elemen adik beradik sejurus selepas elemen yang ditentukan 2. Pemilih adik beradik sejagat, gunakan simbol "~" untuk memilih elemen adik beradik sejurus selepas elemen yang ditentukan, dsb. .

Sistem pengendalian untuk tutorial ini: sistem Windows 10, komputer DELL G3.

Pemilih lanjutan ialah jenis pemilih dalam CSS yang digunakan untuk memilih dan mengendalikan elemen tertentu Ia menyediakan kaedah pemilihan yang lebih fleksibel dan tepat. Pemilih lanjutan boleh memilih berdasarkan perhubungan, status, atribut, dsb. elemen, membantu pembangun mengawal dan menggayakan elemen halaman dengan lebih baik. Berikut ialah beberapa pemilih lanjutan biasa:

1 Pemilih Adik Beradik Bersebelahan: Gunakan simbol `+` untuk memilih elemen adik beradik serta-merta mengikut elemen yang ditentukan. Contohnya, pemilih `h1 + p` memilih elemen `p` serta-merta mengikuti elemen `h1`.

2 Pemilih Adik Beradik Umum: Gunakan simbol `~` untuk memilih semua elemen adik beradik selepas elemen yang ditentukan. Contohnya, pemilih `h1 ~ p` boleh memilih semua elemen `p` selepas elemen `h1`.

3 Pemilih Kanak-kanak: Gunakan simbol `>` untuk memilih elemen anak langsung bagi elemen yang ditentukan. Contohnya, pemilih `.container > p` ​​boleh memilih elemen anak langsung `p` di bawah elemen `.container`.

4 Pemilih Keturunan: Pisahkan dua pemilih dengan ruang untuk memilih elemen turunan pemilih pertama. Contohnya, pemilih `.container p` memilih semua elemen `p` dalam elemen `.container`.

5 Pemilih Atribut: Gunakan nilai atribut elemen sebagai pemilih untuk memilih elemen dengan nilai atribut tertentu. Contohnya, pemilih `[attribute=value]` memilih elemen dengan nilai atribut tertentu.

6 :not(selector): Pemilih :not digunakan untuk memilih elemen yang tidak sepadan dengan pemilih yang ditentukan. Anda boleh menggunakan pemilih :not untuk mengecualikan elemen tertentu dan memilih elemen lain sahaja.

7. :nth-child(n): Pemilih :nth-child digunakan untuk memilih elemen anak ke-n bagi elemen induk. Anda boleh mentakrifkan gaya untuk elemen anak pada kedudukan tertentu melalui pemilih :nth-child, dengan n boleh menjadi nombor tertentu, kata kunci (seperti genap, ganjil) atau formula (seperti 2n+1).

8. :nth-last-child(n): Pemilih :nth-last-child digunakan untuk memilih elemen anak ke-nth dari bahagian bawah elemen induk. Anda boleh menentukan gaya untuk elemen anak ke-n dari bawah melalui pemilih :nth-last-child.

9. :nth-of-type(n): Pemilih :nth-of-type digunakan untuk memilih elemen anak ke-nth jenis tertentu dalam elemen induk. Anda boleh menentukan gaya untuk elemen kanak-kanak jenis tertentu melalui pemilih :nth-of-type.

10 :nth-last-of-type(n): Pemilih :nth-last-of-type digunakan untuk memilih elemen anak ke-nth daripada yang terakhir bagi jenis tertentu dalam induk unsur. Anda boleh menggunakan pemilih :nth-last-of-type untuk menentukan gaya bagi elemen anak ke-nth dari bahagian bawah jenis tertentu.

Pemilih lanjutan ini boleh digunakan dalam kombinasi untuk pemilihan dan penggayaan yang lebih tepat dan fleksibel. Pemilih lanjutan memainkan peranan penting dalam CSS dan boleh membantu pembangun mengawal dan meletakkan elemen halaman dengan lebih baik.

Perlu diingatkan bahawa keserasian pemilih lanjutan yang berbeza mungkin berbeza-beza dalam pelayar yang berbeza. Apabila menggunakan pemilih lanjutan, adalah disyorkan untuk melakukan ujian keserasian terlebih dahulu untuk memastikan gaya digunakan dengan betul dalam penyemak imbas sasaran.

Ringkasnya, pemilih lanjutan biasa termasuk pemilih adik beradik bersebelahan, pemilih adik beradik universal, pemilih elemen anak, pemilih keturunan, pemilih atribut, :bukan pemilih, pemilih anak ke-nth, :pemilih anak-terakhir ke- , :nth-of-type selector dan :nth-last-of-type selector. Dengan menggunakan pemilih lanjutan ini, pembangun boleh memilih dan menggayakan elemen halaman dengan lebih tepat. Saya harap jawapan di atas dapat membantu anda, jika anda mempunyai sebarang soalan lain, sila beritahu saya.

Atas ialah kandungan terperinci Apakah pemilih lanjutan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!