Apakah keutamaan pemilih css

Keutamaan pemilih CSS ditentukan dalam susunan berikut: Keistimewaan (ID > Kelas > Jenis > Kad liar) Susunan sumber (Sebaris > Helaian gaya dalaman > Helaian gaya luaran > Helaian gaya ejen pengguna) Urutan pengisytiharan ( Pengisytiharan kemudian diutamakan ) Kepentingan (!penting memaksa keutamaan lebih tinggi)

Keutamaan pemilih CSS

Keutamaan pemilih CSS menentukan yang mana satu dipilih apabila berbilang pemilih digunakan pada peranti elemen akan digunakan. Pemilih dengan keutamaan yang lebih tinggi akan mengatasi pemilih jenis yang sama dengan keutamaan yang lebih rendah.

Keutamaan pemilih CSS ditentukan oleh empat aspek berikut, disusun dari tinggi ke rendah:

1 Kekhususan

Kekhususan ditentukan oleh bilangan dan kedudukan jenis pemilih yang digunakan dalam pemilih. Jenis pemilih berikut mempunyai kekhususan yang semakin meningkat:

• Pemilih ID (#)
• Pemilih kelas (.)
• Pemilih jenis (html, badan, dll.)
• Wildcard (*)

.

Jika dua pemilih mempunyai kekhususan yang sama, yang berasal dari sumber yang lebih khusus diutamakan. Urutan sumber ialah:

• Gaya sebaris
• Helaian gaya dalaman
• Helaian gaya luaran
• Helaian gaya ejen pengguna

3. , pengisytiharan yang ditulis kemudian dalam dokumen CSS mempunyai keutamaan yang lebih tinggi.

4. Kepentingan

!penting kata kunci boleh memaksa keutamaan pemilih ditingkatkan. Walau bagaimanapun, penggunaannya harus dielakkan kerana ia melanggar kebolehselenggaraan CSS.

Contoh: !important 关键字可以强制提高选择器的优先级。然而，它的使用应避免，因为它会破坏 CSS 的可维护性。

示例：

以下示例说明了优先级的应用：

#primary {
  color: red;
}

.bold {
  color: blue;
}

p {
  color: green;
}

body {
  color: black;
}

p.bold {
  color: purple !important;
}

在上面的示例中，p.bold 的特殊性为 2（类型选择器 + 类选择器），并且声明中包含 !important，因此具有最高的优先级。因此，对于具有 p.bold 类的段落，p.bold 的样式（紫色）将被应用，而不是 #primary（特殊性为 1）、.bold（特殊性为 1）或 p

🎜Contoh berikut menggambarkan penerapan keutamaan: 🎜rrreee🎜Dalam contoh di atas, p.bold mempunyai kekhususan 2 (pemilih jenis + pemilih kelas) , dan pengisytiharan mengandungi !penting, jadi ia mempunyai keutamaan tertinggi. Oleh itu, untuk perenggan dengan kelas p.bold, gaya (ungu) p.bold akan digunakan dan bukannya #primary (khas gaya dengan kekhususan 1), .bold (kekhususan 1), atau p (kekhususan 0). 🎜

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