dfox - 5 months ago 36

CSS Question

Says I have 10

`<p>`

`<p>`

Answer

You can use the `nth-child(n+x)`

selector such as:

```
p:nth-child(n+6) {
display:none;
}
```

Here's a fiddle demonstrating with the color red for 6+

`n+6`

is an abbreviation for the formula equation `an+b`

(see specs and mdn) which is iterated through for every values of "n" that are >=0 and where a and b are integers >0. So the full formula in this case it is equivalent:

```
1n+6
```

Which for values of `n`

as 0,1.. would give: 6,7... matching the 6th and up tags.

By modifying `b`

we are able to create intervals such as:

```
2n+6
```

Which for values of n as 0,1 now yields 6, 8, 10 and so on, effectively matching every other `p`

tag starting from the 6th one.