nth-Last-Child digunakan untuk menyeleksi element berdasarkan urutan anak (child) dari element terakhir ke atas pada element. Dalam sebuah element, terdapat tag pembuka (opening tag) dan tag penutup (closing tag), contoh: opening tag: <div> dan closing tag-nya adalah: </div> yang ditandai dengan /. Jadi, setiap element yang berada didalam element lain (didalam tag pembuka dan tag penutup), bisa dikatakan child atau anak element dari element yang menaunginya.

Langsung saja kita praktek, silahkan kalian salin code di bawah ini :

HTML//

<!DOCTYPE html>
<html>
<head>

</head>
<body>

<p>The first paragraph.</p>
<p>The second paragraph.</p>
<p>The third paragraph.</p>
<p>The fourth paragraph.</p>

<p><b>Note:</b> Internet Explorer 8 and earlier versions do not support the :nth-last-child() selector.</p>

</body>
</html>

CSS//

p:nth-last-child(2) {
    background: red;
} 

Setelah kalian salin lalu jalankan pada browser masing-masing maka hasilnya akan seperti ini :

last child2

 

Nah bisa kita lihat pada gambar di atas kita telah menyeleksi child pada sebuah  element dengan urutan nomor 2 dari bawah.

 

Oke itu saja semoga bermanfaat  dan sampai bertemu pada artikel selanjuitnya

Terimakasih. 🙂