Bagaimana Menggayakan Semua Kanak-Kanak Kecuali Anak Terakhir dalam CSS?

Menggunakan CSS untuk Memilih Kanak-kanak Kecuali Anak Terakhir

Dalam pembangunan web, khususnya menggunakan CSS, mungkin terdapat keadaan di mana anda ingin memohon gaya kepada semua kanak-kanak unsur kecuali anak terakhir. Ini boleh dicapai menggunakan kelas pseudo penolakan Pemilih CSS Tahap 3.

Sintaks:

:not(:last-child) { /* styles */ }

Cara Ia Berfungsi:

Kelas pseudo :not() membenarkan anda mengecualikan elemen yang sepadan dengan yang ditentukan pemilih. Dalam kes ini, kami menggunakannya untuk menafikan :last-child pseudo-class, yang memilih elemen anak terakhir.

Contoh:

Pertimbangkan struktur HTML berikut :

<div>
  <div>First child</div>
  <div>Second child</div>
  <div>Third child</div>
</div>

Untuk menggayakan semua kanak-kanak kecuali anak terakhir, anda boleh menggunakan yang berikut CSS:

:not(:last-child) {
  background-color: blue;
}

Ini akan menggunakan warna latar belakang biru kepada dua kanak-kanak pertama, tetapi bukan anak ketiga.

Keserasian:

Perlu diingat bahawa kelas pseudo :not() tidak disokong dalam Internet Explorer 8 atau penyemak imbas terdahulu.

Atas ialah kandungan terperinci Bagaimana Menggayakan Semua Kanak-Kanak Kecuali Anak Terakhir dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!