CSS :nth-last-child Sözde Sınıfı

Bu sözde sınıf :nth-child sözde sınıfının yaptığı her şeyi aynen yapmaktadır. Farklı olarak, nth-child baştan başlarken, bu sözde sınıf ile sondan seçmeye başlıyoruz.

Örneğin son li etiketini seçmek isteseydim;

<ul>
    <li>liste</li>
    <li>liste</li>
    <li>liste</li>
    <li>liste</li>
    <li>liste</li>
</ul>
<style>
ul li:nth-last-child(1) {
    background-color: lime;
}
</style>

Editörde Görüntüle

Sonuç başarılı olacaktı;

liste
liste
liste
liste
liste

Kısaca nth-child sözde sınıfında uzun uzun anlattığım durumların aynısını sondan seçme işlemi yapacak şekilde bu sözde sınıf ile birlikte kullanabilirsiniz. Örneğin bazen son 3 elemanı seçip margin değerlerini vs. sınırlandırmak isteyebilirsiniz front-end çalışmalarınızda. O da şöyle olabilir;

ul li:nth-last-child(-n+3) {
    background-color: lime;
}

Bu şekilde sondan 3 li etiketini seçip stil uygulayacaktır.