Bagaimana untuk Menyasarkan Elemen Khusus dalam Senarai Menggunakan nth-child dalam IE8?

Nth-Child dan :before dalam IE8

Keupayaan untuk menggunakan nth-child untuk menyasarkan elemen tertentu dalam senarai ialah CSS yang berkuasa ciri yang malangnya, tidak disokong dalam Internet Explorer 8 (IE8). Ini boleh menjadi halangan yang ketara apabila bekerja dengan reka letak HTML yang kompleks.

Walau bagaimanapun, terdapat penyelesaian yang boleh digunakan untuk mencapai kefungsian serupa dalam IE8 menggunakan penggabung saudara bersebelahan ( ). Helah ini melibatkan penyasaran elemen anak pertama dan kemudian menggunakan pemilih untuk menyasarkan adik-beradik berikutnya.

Sebagai contoh, untuk menyasarkan anak pertama dalam senarai dan memberikannya sempadan merah, kita boleh menggunakan CSS berikut:

#nav-primary ul li:first-child a {
  border-top: 5px solid red;
}

Begitu juga, untuk menyasarkan anak kedua dan memberikannya sempadan biru, kita boleh menggunakan:

#nav-primary ul li:first-child + li a {
  border-top: 5px solid blue;
}

Ini teknik boleh digunakan untuk menyasarkan elemen tertentu berdasarkan kedudukannya dalam senarai, walaupun :nth-child tidak disokong dalam IE8. Walau bagaimanapun, adalah penting untuk ambil perhatian bahawa variasi yang lebih kompleks bagi :nth-child, seperti :nth-child(odd) atau :nth-child(4n 3), tidak boleh dicontohi menggunakan kaedah ini.

Atas ialah kandungan terperinci Bagaimana untuk Menyasarkan Elemen Khusus dalam Senarai Menggunakan nth-child dalam IE8?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!