nth-child nasıl çalışıyor?

:nth-child adında bir CSS seçicisi var, işte onu kullanmanın bir örneği:

ul li:nth-child(3n+3){ 
  color: #ccc;
}

Yukarıdaki CSS’nin yaptığı şey, sırasız listelerdeki her üçüncü liste öğesini seçmektir. Yani 3., 6., 9., 12. vb. Ama bu nasıl çalışıyor ve :nth-child ile başka ne tür şeylerle yapabilirsiniz?

Devamı: css-tricks.com/how-nth-child-works/

Test etmek için güncel araç: css-tricks.com/examples/nth-child-tester/

:nth-child() – https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-child