Apakah pemilih gaya?

Pemilih gaya termasuk pemilih elemen, pemilih kelas, pemilih ID, pemilih atribut, pemilih keturunan, pemilih elemen anak, pemilih adik beradik bersebelahan, pemilih adik beradik sejagat, pemilih kelas pseudo dan Peranti pemilih elemen pseudo dll. Pengenalan terperinci: 1. Pemilih elemen, memilih elemen melalui nama tag elemen HTML 2. Pemilih kelas, memilih elemen melalui atribut kelas dan menggunakan simbol "." melalui Atribut id bagi elemen memilih elemen, dan simbol "#" digunakan untuk mewakili pemilih ID 4. Pemilih atribut, dsb.

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

Dalam CSS, pemilih gaya digunakan untuk memilih elemen HTML yang mana gaya perlu digunakan. CSS menyediakan pelbagai pemilih gaya Berikut adalah beberapa pemilih gaya yang biasa digunakan:

1. Pilih elemen melalui nama tag elemen HTML. Sebagai contoh, pemilih p memilih semua elemen perenggan.

2. Pemilih Kelas: Pilih elemen melalui atribut kelasnya. Gunakan simbol "." untuk mewakili pemilih kelas. Sebagai contoh, .red akan memilih elemen dengan atribut kelas "red".

3 Pemilih ID: Pilih elemen melalui atribut idnya. Gunakan simbol "#" untuk mewakili pemilih ID. Sebagai contoh, #header memilih elemen dengan atribut id "header".

4. Pemilih Atribut: Pilih elemen melalui atributnya. Sebagai contoh, [type="text"] akan memilih semua elemen yang nilai atribut jenisnya ialah "teks".

5. Pemilih Keturunan: Pilih elemen melalui hubungan keturunan mereka. Gunakan ruang untuk menunjukkan pemilih keturunan. Sebagai contoh, div p akan memilih semua elemen perenggan di dalam elemen div.

6 Pemilih Kanak-kanak: Pilih elemen melalui hubungan elemen anak langsung mereka. Gunakan simbol ">" untuk mewakili pemilih elemen kanak-kanak. Sebagai contoh, ul > li akan memilih elemen anak langsung li di bawah elemen ul.

7. Pemilih Adik Beradik Bersebelahan: Pilih elemen adik beradik serta-merta mengikut elemen yang ditentukan. Gunakan simbol "+" untuk mewakili pemilih adik beradik bersebelahan. Contohnya, h1 + p memilih elemen perenggan serta-merta mengikuti elemen h1.

8 Pemilih Adik Beradik Umum: Memilih semua elemen adik beradik yang mempunyai elemen induk yang sama dengan elemen yang ditentukan dan berada di belakang elemen yang ditentukan. Gunakan simbol "~" untuk menunjukkan pemilih adik beradik sejagat. Contohnya, h1 ~ p akan memilih semua elemen perenggan yang mempunyai elemen induk yang sama dengan elemen h1 dan berada di belakang elemen h1.

9. Pemilih kelas Pseudo: Pilih elemen melalui status istimewanya. Pemilih kelas pseudo bermula dengan ":". Contohnya, a:hover memilih keadaan tetikus atas pautan.

10. Pemilih unsur Pseudo: Pilih bahagian tertentu elemen. Pemilih unsur pseudo bermula dengan "::". Contohnya, ::before memilih kandungan yang disisipkan sebelum elemen.

Selain daripada pemilih gaya biasa yang disenaraikan di atas, terdapat juga beberapa pemilih gaya lain, seperti pemilih elemen induk, pemilih ruang, dsb. Pemilih gaya yang berbeza boleh digabungkan untuk pemilihan elemen dan aplikasi gaya yang lebih tepat.

Perlu diingat bahawa lebih spesifik julat pemilihan pemilih gaya, lebih tinggi keutamaannya. Apabila menulis gaya CSS, anda harus memilih pemilih gaya yang sesuai mengikut keperluan khusus untuk memastikan gaya boleh digunakan dengan tepat pada elemen sasaran. Pada masa yang sama, anda juga harus memberi perhatian kepada prestasi pemilih gaya untuk mengelakkan kemerosotan prestasi yang disebabkan oleh pemilih yang terlalu kompleks.

Untuk meringkaskan, CSS menyediakan pelbagai pemilih gaya, termasuk pemilih elemen, pemilih kelas, pemilih ID, pemilih atribut, pemilih keturunan, pemilih elemen anak, pemilih adik beradik bersebelahan dan pemilih adik beradik universal , pemilih kelas pseudo dan pseudo-. pemilih elemen, dsb. Dengan menggunakan pemilih gaya ini secara rasional, anda boleh memilih elemen dengan tepat dan menggunakan gaya untuk mencapai reka letak dan kesan halaman yang kaya dan pelbagai.

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