:nth-child e :last-child no CSS

Alguns exemplos de como usar :nth-child e :last-child no CSS, consideramos aplicar em uma lista mas você poderá utilizar de diversas formas no seu código.

Selecionar o terceiro elemento de uma lista por exemplo:

:nth-child e :last-child no CSS

Selecionar os quatro elementos a partir do primeiro:

:nth-child e :last-child no CSS

Selecionar  todos os elementos menos os quatro primeiros:

:nth-child e :last-child no CSS

Selecionar o primeiro elemento a cada três:

:nth-child e :last-child no CSS

Selecionar os ímpares:

:nth-child e :last-child no CSS

Selecionar os pares:

:nth-child e :last-child no CSS

Selecionar o penúltimo elemento:

:nth-child e :last-child no CSS

Selecionar o último elemento:

:nth-child e :last-child no CSS

Selecionar o primeiro elemento somente:

:nth-child e :last-child no CSS

* A pseudo-classe nth-child é parte dos seletores no CSS 3 e funciona na maioria dos browsers atuais (confira no caniuse a lista).

Mais exemplos: https://developer.mozilla.org/pt-BR/docs/Web/CSS/:nth-child

O link https://css-tricks.com/examples/nth-child-tester/  tem como testar a aplicação das regras em exemplos aplicados em tags html.

Outras Pseudo-classes: https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes

Deixe seu comentário abaixo

Loading Facebook Comments ...