Pemilih anak ke-nth dalam CSS membenarkan pemilihan elemen yang tepat berdasarkan kedudukannya dalam elemen induk. Walau bagaimanapun, adalah sukar untuk menggunakan pemilih ini untuk julat yang tidak ditakrifkan oleh nombor tertentu.
Pertimbangkan pemilih CSS berikut:
<code class="css">.myTableRow td:nth-child(?){ background-color: #FFFFCC; }</code>
Pemilih ini bertujuan untuk menggunakan warna latar belakang pada julat
Untuk menggunakan pemilih ini pada
<code class="css">.myTableRow td:nth-child(n+2):nth-child(-n+4){ background-color: #FFFFCC; }</code>
Pemilih ini menggunakan dua sub-pemilih anak ke-n tambahan:
Dengan menggabungkan kedua-dua sub-pemilih ini, kami mencipta julat yang merangkumi elemen dari kedudukan ke-2 hingga ke-4 dengan berkesan.
Pertimbangkan jadual HTML berikut:
<code class="html"><table> <tr class="myTableRow"> <td>column 1</td> <td>column 2</td> <td>column 3</td> <td>column 4</td> <td>column 5</td> </tr> </table></code>
Menggunakan pemilih CSS yang dipertingkatkan pada jadual ini akan menyebabkan warna latar belakang digunakan pada
Atas ialah kandungan terperinci Bagaimana untuk Memilih Rangkaian Elemen dengan CSS nth-child?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!