Apakah maksud ~ dalam css

Pengendali ~ dalam CSS "pemilih keturunan universal" digunakan untuk memadankan semua adik beradik berikutnya bagi sesuatu elemen. Sintaks ialah selector1 ~ selector2, yang bermaksud untuk memadankan elemen adik beradik selepas selector1, dan elemen tersebut mempunyai gaya selector2. Ia biasanya digunakan dalam senario seperti gaya elemen kanak-kanak, menu navigasi dan kebolehbacaan jadual.

Maksud ~ dalam CSS

Pengendali ~ dalam CSS, dikenali sebagai "pemilih keturunan sejagat", digunakan untuk memadankan semua adik beradik berikutnya bagi sesuatu elemen. Khususnya:

• Sintaks: pemilih1 ~ pemilih2selector1 ~ selector2
• 含义：匹配所有位于 selector1 后面且具有 selector2

Maksud:

Padan dengan semua yang terletak selepas pemilih1 dan mempunyai pemilih2 elemen gaya, tetapi ia mestilah elemen adik beradik (iaitu, di bawah elemen induk yang sama).

Contoh:

Gaya berikut akan menambah sempadan merah pada semua elemen perenggan yang terletak selepas elemen dengan nama kelas "kotak":

<code class="css">.box ~ p {
  border: 1px solid red;
}</code>

Bagaimana untuk menggunakan pemilih ~?

• ~ Pemilih biasanya digunakan untuk:
• Menggunakan gaya elemen kanak-kanak: Menggunakan gaya pada elemen kanak-kanak tertentu bagi elemen induk tertentu.
• Buat Menu Navigasi: Tambah gaya pada item menu navigasi pada tuding atau keadaan aktif.
• Buat Kotak Semak dan Butang Radio: Gunakan gaya pada label kotak pilihan atau butang radio.

Tingkatkan kebolehbacaan jadual:

Seli tambahkan warna atau latar belakang yang berbeza pada baris jadual.

Perlu diambil perhatian bahawa:
• ~ Pemilih hanya boleh memadankan unsur adik beradik yang berikutnya, tetapi bukan unsur induk atau unsur nenek moyang.

🎜~ Pemilih melakukan carian mendalam-pertama bagi elemen dalam pepohon dokumen, yang bermaksud ia akan memadankan elemen kanak-kanak dahulu dan kemudian elemen adik-beradik. 🎜🎜

Atas ialah kandungan terperinci Apakah maksud ~ dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!