Kategoriler
Kodlama

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

CSS’de alt öğe seçici(nth-child), alt öğeleri JavaScript kullanmadan karmaşık desenlerle eşleştirmenin güçlü bir yoludur.

: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

WOLKANCA

Volkan Yılmaz

nth-child nasıl çalışıyor? başlıklı gönderi hakkında herhangi bir sorunuz varsa, sosyal medya butonları ile yorum ya da mesaj göndermekten çekinmeyin.