How do you use nth-child() selector?

Selects elements based on their order within a parent.

Examples:

li:nth-child(2) { color: red; } /* 2nd item */

li:nth-child(odd) { background: #eee; } /* odd items */

li:nth-child(3n) { font-weight: bold; } /* every 3rd item */

Key Takeaway:

nth-child() gives you precise control over repeating patterns in lists or grids.

dvanced