Ketahui tentang pelbagai jenis pemilih kompaun komputer dan kegunaannya

Pemahaman mendalam tentang jenis dan penggunaan pemilih kompaun komputer

Pengenalan: Dalam pembangunan bahagian hadapan, pemilihan dan pengendalian elemen halaman adalah sangat penting. Dalam CSS, pemilih memainkan peranan penting. Pemilih kompaun ialah pemilih yang sangat berkuasa yang boleh memilih elemen berdasarkan berbilang syarat. Artikel ini akan memberikan pemahaman dan analisis yang mendalam tentang jenis dan penggunaan pemilih kompaun.

1. Apakah pemilih kompaun? Pemilih kompaun ialah pemilih yang terdiri daripada berbilang pemilih mudah dengan tepat pada halaman berdasarkan beberapa syarat pemilihan. Pemilih kompaun boleh meningkatkan fleksibiliti dan ketepatan pemilih, membolehkan kami memilih elemen yang perlu dikendalikan dengan lebih tepat.

2. Jenis pemilih kompaun asas

Pemilih keturunan

1. Pemilih keturunan terdiri daripada dua atau lebih pemilih yang dipisahkan oleh ruang. Contohnya, untuk memilih gaya semua
2. elemen di bawah

Pemilih elemen kanak-kanak

2. Pemilih elemen kanak-kanak terdiri daripada dua pemilih yang dipisahkan oleh tanda yang lebih besar daripada (> Ia memilih elemen anak langsung bagi elemen yang ditentukan. Contohnya, untuk memilih gaya untuk semua
   elemen anak langsung
   • , gunakan pemilih anak ul >

Pemilih adik beradik bersebelahan

3. Pemilih adik beradik bersebelahan terdiri daripada dua pemilih yang dipisahkan dengan tanda tambah (+ Ia memilih elemen adik beradik pertama sejurus selepas elemen yang ditentukan. Contohnya, untuk memilih gaya elemen adik beradik bersebelahan pertama

selepas semua elemen

anda boleh menggunakan pemilih adik beradik bersebelahan p + a.

Pemilih adik beradik am

4. Pemilih adik beradik am terdiri daripada dua pemilih yang dipisahkan oleh tilde (~ Ia memilih semua elemen adik beradik selepas elemen yang ditentukan. Contohnya, untuk memilih gaya semua elemen adik beradik

selepas semua elemen

anda boleh menggunakan pemilih adik beradik am p ~ a.

3. Jenis pemilih kompaun kompleks

Pemilih atribut

1. Pemilih atribut digunakan untuk memilih elemen berdasarkan nilai atributnya. Pemilih atribut biasa mempunyai bentuk berikut:

[attr]: Pilih elemen dengan atribut yang ditentukan.

• [attr=value]: Pilih elemen dengan atribut yang ditentukan dan nilai atribut ialah nilai yang ditentukan.
• [attr~=value]: Pilih elemen dengan atribut yang ditentukan dan nilai atribut mengandungi nilai yang ditentukan, dan nilai dipisahkan oleh ruang.
• [attr^=value]: Pilih elemen dengan atribut yang ditentukan dan nilai atribut bermula dengan nilai yang ditentukan.
• [attr$=value]: Pilih elemen dengan atribut yang ditentukan dan nilai atribut berakhir dengan nilai yang ditentukan.
• [attr*=value]: Pilih elemen dengan atribut yang ditentukan dan nilai atribut mengandungi nilai yang ditentukan, tanpa mengehadkan kedudukan.

Pemilih kelas pseudo

2. Pemilih kelas pseudo digunakan untuk memilih keadaan atau kedudukan tertentu elemen. Pemilih kelas pseudo biasa mempunyai bentuk berikut:

:hover: Pilih keadaan apabila tetikus melayang di atas elemen.

• :aktif: Pilih keadaan apabila elemen diaktifkan.
• :dilawati: Pilih status pautan yang dilawati.
• :fokus: Pilih keadaan apabila fokus diperoleh.
• :nth-child(n): Pilih elemen anak ke-n bagi elemen tersebut.

Pemilih unsur pseudo

3. Pemilih unsur pseudo digunakan untuk memasukkan kandungan tambahan sebelum dan selepas kandungan elemen. Pemilih unsur pseudo biasa mempunyai bentuk berikut:

::sebelum: Sisipkan kandungan tambahan sebelum kandungan elemen.

• ::selepas: Masukkan kandungan tambahan selepas kandungan elemen.
• ::huruf pertama: Pilih huruf pertama elemen.
• ::baris pertama: Pilih baris pertama elemen.
• 4. Contoh penggunaan pemilih kompaun

Berikut ialah beberapa contoh penggunaan pemilih kompaun:

Pilih semua elemen anak langsung

1. Memilih semua elemen adik beradik bersebelahan serta-merta mengikut elemen

   elemen mengandungi elemen yang nilai kelas atributnya ialah "aktif":

   ul li[class=active]

2. select

   Status :hover bagi elemen:

a:hover

3. Ringkasan: Pemilih Kompaun peranan yang sangat penting dalam CSS Mereka boleh memilih elemen halaman berdasarkan berbilang syarat. Dengan menggabungkan pemilih yang berbeza, kami boleh mencapai pemilihan dan pengendalian elemen halaman yang tepat. Menguasai jenis dan penggunaan pemilih kompaun boleh meningkatkan kecekapan kerja pembangun bahagian hadapan dan menjadikan halaman itu menyajikan kesan visual yang lebih cantik.

Atas ialah kandungan terperinci Ketahui tentang pelbagai jenis pemilih kompaun komputer dan kegunaannya. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!