Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Mengecualikan Elemen Pertama Menggunakan Pemilih CSS?

Bagaimanakah Saya Boleh Mengecualikan Elemen Pertama Menggunakan Pemilih CSS?

Patricia Arquette
Lepaskan: 2024-12-01 00:53:10
asal
212 orang telah melayarinya

How Can I Exclude the First Element Using CSS Selectors?

Mengecualikan Elemen Pertama dengan CSS :not:first-child Selector

Dalam CSS, :first-child selector menyasarkan yang pertama unsur anak daripada unsur induknya. Untuk mengecualikan elemen pertama, anda boleh menggunakan pemilih songsang :not:first-child.

Percubaan 1: Menggunakan :not:first-child

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

Percubaan 2: Menggunakan :not(:first-child)

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

Percubaan 3: Menggunakan :first-child:after

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

Walau bagaimanapun, tiada satu pun daripada ini kaedah mencapai hasil yang diingini.

Penyelesaian: Menggunakan Keserasian Penyemak Imbas Betulkan

Pemilih :not hanya menerima pemilih mudah sebagai hujahnya. Oleh itu, untuk menyokong pelayar lama yang tidak menyokong sintaks :not(:first-child), anda boleh menggunakan teknik alternatif:

  1. Tentukan peraturan dengan skop yang lebih luas daripada yang dimaksudkan:
div ul {
    background-color: #900;
}
Salin selepas log masuk
  1. "Batalkan" peraturan dengan bersyarat untuk mengehadkan skopnya kepada yang dikecualikan elemen:
div ul:first-child {
    background-color: transparent;
}
Salin selepas log masuk

Penjelasan:

Peraturan pertama menggunakan warna latar belakang pada semua elemen ul. Peraturan kedua menggunakan nilai lalai (telus) untuk warna latar belakang, dengan berkesan mengalih keluar warna latar belakang daripada elemen ul anak pertama.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengecualikan Elemen Pertama Menggunakan Pemilih 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