ใน CSS 3.0 มีการใช้งาน selector ที่หลากหลายมากขึ้น ทำให้การจัดการเอกสารต่างๆ ทำได้ง่ายมาขึ้นมาก ครั้งนี้เรามาดู selector ที่มีประโยชน์อีกตัวหนึ่งกัน นั่นคือ nth-child คือการระบุถึง selector ที่ n เราสามารถใช้ประโยชน์เพื่ออ้างถึง element ต่างๆในเอกสารได้เช่น

P:nth-child(3) {
    background-color: #FFD;
}

จากตัวอย่างเป็นการอ้างถึง paragraph ลำดับที่ 3

ในการแต่งสีตารางสามารถทำได้ได้เช่น

TR:nth-child(2n+1) {
    background-color: #EEE;
}

TR:nth-child(2n+0) {
    background-color: #FFF;
}

เราเลือกใช้ selector เพื่อให้มีผลกับ TR เมื่อเอาไปใช้งานจะมีผลให้ตารางสลับสีกันในแต่ละแถว โดยในที่นี้ CSS 3.0 ยังสามารถเขียนได้ด้วย

TR:nth-child(odd) {
    background-color: #EEE;
}

TR:nth-child(even) {
    background-color: #FFF;
}

เราสามารถใช้ odd และ even ได้ในการแทนแถวลำดับที่เป็นเลขคี่และเลขคู่ตามลำดับ

ตารางสลับสีด้วย CSS3