WEBinP Your guide to resolving CMS optimization, Web Development and SEO problems
I used the most popular query for my practice in the post title, but there are more options in the table below.
Options for :nth-child
| 1 | 1 | The first element, is a synonym for the :first-child pseudo-class | 5 | 5 | 5th element | 2n | 2, 4, 6, 8, 10 | All even elements, equivalent to even | 2n+1 | 1, 3, 5, 7, 9 | All odd elements, equivalent to odd | 3n+2 | 2, 5, 8, 11, 14 | — | -n+3 | 3, 2, 1 | — | 5n-2 | 3, 8, 13, 18, 23 | — | even | 2, 4, 6, 8, 10 | All even elements | odd | 1, 3, 5, 7, 9 | All odd elements |
How to use:
div.test p:nth-child(2n) {font-size: 2em;}
.block .intro:nth-child(2n+1) {background: #000;}
