Bagaimana untuk Menyasarkan Julat Lajur Tertentu dalam Jadual Menggunakan Pemilih CSS?

Pemilih CSS untuk Julat Lajur Tertentu

Soalan ini menangani keperluan untuk menyesuaikan pemilih CSS untuk digunakan pada julat lajur tertentu dalam sebuah meja. Pemilih asal, .myTableRow td:nth-child(?), menyasarkan elemen anak tertentu berdasarkan kedudukannya dalam baris jadual. Walau bagaimanapun, soalan mencari cara untuk menggunakan pemilih pada lajur 2 hingga 4.

Seperti yang dicadangkan oleh jawapan, satu pendekatan ialah menggunakan pemilih berikut:

<code class="css">.myTableRow td:nth-child(n+2):nth-child(-n+4) {
  background-color: #FFFFCC;
}</code>

Pemilih ini menyasarkan semua sel jadual (td) yang merupakan anak ke-2 atau lebih baru dan sehingga anak ke-4 dalam baris dengan kelas myTableRow. Ini secara berkesan memilih julat lajur yang diingini.

Satu lagi kelebihan pendekatan ini ialah keteguhannya, kerana ia tidak terikat dengan jumlah bilangan lajur dalam jadual. Ia akan berfungsi tanpa mengira bilangan lajur yang ada.

Penjelasan Sintaks Pemilih:

• :nth-child(n X): Memilih semua kanak-kanak dari kedudukan X dan seterusnya.
• :nth-child(-n X): Memilih semua kanak-kanak sehingga kedudukan Xth.

Apabila digabungkan, pemilih ini menyasarkan elemen yang termasuk dalam julat tertentu, seperti yang ditunjukkan dalam contoh kod yang disediakan.

Atas ialah kandungan terperinci Bagaimana untuk Menyasarkan Julat Lajur Tertentu dalam Jadual Menggunakan Pemilih CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!