Mengapakah Saya Tidak Boleh Menggabungkan Elemen Pseudo dan Kelas Khusus Vendor dalam CSS Menggunakan Pemilih Dipisahkan Koma?

Mengapa Elemen Pseudo dan Kelas Khusus Vendor Tidak Boleh Digabungkan

Walaupun kemudahan menggunakan pemilih dipisahkan koma untuk menggunakan gaya yang sama pada berbilang elemen, pendekatan ini tidak boleh digunakan pada elemen pseudo dan kelas khusus vendor. Ketidakkonsistenan ini timbul daripada peraturan asas yang digariskan dalam CSS2.1.

Spesifikasi CSS2.1

Spesifikasi CSS2.1 menyatakan bahawa mana-mana pemilih yang tidak boleh dihuraikan oleh ejen pengguna mesti diabaikan bersama dengan blok pengisytiharan yang sepadan. Ini terpakai pada awalan vendor yang tidak dikenali dalam pemilih kelas pseudo dan unsur pseudo.

Penghuraian Penyemak Imbas

Memandangkan penyemak imbas yang berbeza menggunakan awalan yang berbeza, ejen pengguna tertentu tidak akan dapat menghuraikan elemen dan kelas pseudo dengan awalan yang tidak dikenali. Akibatnya, penyemak imbas ini mesti menggugurkan sebarang peraturan yang mengandungi awalan yang tidak dikenali tersebut, yang membawa kepada keperluan untuk pengisytiharan berulang.

Contoh

Pertimbangkan coretan kod berikut, yang bertujuan untuk menggayakan teks pemegang tempat menggunakan khusus vendor pemilih:

input:-moz-placeholder {
  font-style: italic;
  text-align: right;
}
input::-moz-placeholder {
  font-style: italic;
  text-align: right;
}
input:-ms-input-placeholder {
  font-style: italic;
  text-align: right;
}
input::-webkit-input-placeholder {
  font-style: italic;
  text-align: right;
}

Percubaan untuk menggabungkan peraturan ini menggunakan koma akan mengakibatkan:

input:-moz-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder,
input::-webkit-input-placeholder {
  font-style: italic;
  text-align: right;
}

Walau bagaimanapun, set peraturan gabungan ini akan gagal kerana:

• Pelayar yang menggunakan webkit (cth., Safari) tidak dapat menghuraikan awalan :-moz-* .
• Pelayar yang menggunakan tokek (cth., Firefox) tidak boleh menghuraikan :-ms- dan :-webkit- awalan.
• Pelayar yang menggunakan edge (cth., Internet Explorer) tidak boleh menghuraikan :-webkit- dan :-moz- awalan .

Kesimpulan

Disebabkan pelayar had penghuraian, adalah tidak mungkin untuk menggabungkan elemen pseudo dan kelas khusus vendor ke dalam pemilih yang dipisahkan koma tunggal. Ini membawa kepada keperluan pengisytiharan berulang apabila menggayakan elemen merentas pelayar yang berbeza.

Atas ialah kandungan terperinci Mengapakah Saya Tidak Boleh Menggabungkan Elemen Pseudo dan Kelas Khusus Vendor dalam CSS Menggunakan Pemilih Dipisahkan Koma?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!