CSS’te, nth-last-child özelliği, belirli bir öğeden sonraki belirli bir öğeye kadar tüm öğeleri hedeflemek için kullanılır. Bu özelliği kullanarak, öğelerinizi belirli bir sıraya göre hedefleyebilirsiniz.
Öncelikle, HTML’de hedeflemek istediğiniz öğelerin ana etiketini belirleyin. Ardından, bu ana etikete CSS dosyanızda stil ekleyin. Örneğin, aşağıdaki HTML kodunda, ul etiketi li etiketlerini içeriyor ve son li etiketinden geriye doğru sayarak li etiketlerinin arkaplan rengini değiştireceğiz.
HTML Kodu:
<ul> <li>Öğe 1</li> <li>Öğe 2</li> <li>Öğe 3</li> <li>Öğe 4</li> <li>Öğe 5</li> <li>Öğe 6</li> <li>Öğe 7</li> </ul>
CSS Kodu:
ul li:nth-last-child(3) {
background-color: yellow;
}
Yukarıdaki örnekte, ul etiketinin içindeki son üçüncü li etiketi arka plan rengiyle sarıya boyanacak. nth-last-child özelliği, öğelerin konumunu belirlemek için n sayısını kullanır ve son n öğeyi hedefler. Bu özellikle, son öğeden geriye doğru saymak istediğimiz için nth-last-child kullanıyoruz.
Umarım bu örnek, nth-last-child özelliğinin nasıl kullanılacağına dair bir fikir vermiştir.
Bu uygulamada herhangi bir sorun yaşarsanız aşağıya yorum olarak bırakabilirsiniz. Bunun yanı sıra web sitemizdeki diğer hazır Html programlama örneklerine ulaşmak için bu linke tıklayabilirsiniz.