Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Menggayakan Semua kecuali Elemen Pertama dalam Siri Menggunakan Pemilih `:not(:first-child)` CSS?

Bagaimanakah Saya Boleh Menggayakan Semua kecuali Elemen Pertama dalam Siri Menggunakan Pemilih `:not(:first-child)` CSS?

Susan Sarandon
Lepaskan: 2024-12-02 12:55:13
asal
250 orang telah melayarinya

How Can I Style All but the First Element in a Series Using CSS's `:not(:first-child)` Selector?

Menguasai Pemilih bukan:anak pertama untuk Penguasaan CSS

Soalan:

Bagaimana cara saya menyasarkan setiap elemen dengan berkesan kecuali yang pertama dalam satu siri elemen menggunakan CSS's not:first-child selector? Pengasingan ini menimbulkan cabaran apabila cuba menggayakan elemen tertentu sambil mengecualikan kejadian pertama.

Jawapan:

Untuk mencapai pengasingan ini, terdapat dua pendekatan yang berdaya maju:

1. Menggunakan :not Selector (Pelayar Moden):

Untuk penyemak imbas moden yang menyokong Pemilih CSS Tahap 3, pemilih berikut akan menyasarkan semua elemen dengan tepat kecuali yang pertama:

div ul:not(:first-child) {
    background-color: #900;
}
Salin selepas log masuk

2. Pembatalan Skop Bersyarat:

Untuk penyemak imbas lama atau senario tertentu di mana pemilih :not terhad, anda boleh menggunakan teknik berikut:

  1. Pada mulanya tetapkan peraturan yang digunakan untuk semua elemen jenis yang dikehendaki (cth., semua teg
      dalam a
      ):
div ul {
    background-color: #900;
}
Salin selepas log masuk
  1. Buat peraturan untuk membatalkan gaya ini daripada elemen pertama, tetapkan atribut CSS yang berkenaan kepada nilai lalainya:
div ul:first-child {
    background-color: transparent;
}
Salin selepas log masuk

Dengan membatalkan gaya secara bersyarat, anda menyasarkan setiap elemen dengan berkesan kecuali yang pertama. Pendekatan ini menyediakan keserasian dengan penyemak imbas lama dan membolehkan kawalan yang lebih terperinci ke atas pengecualian gaya.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggayakan Semua kecuali Elemen Pertama dalam Siri Menggunakan Pemilih `:not(:first-child)` CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan