Selecionando com nth-of-type.

Oi Laércio, tudo bem? Eu acho apenas que a regra nos parênteses não tá correta, se usar n + 2 (vai pegar do parágrafo 2 em diante).

Mas no caso do HTML mostrado, ele não vai pegar nenhum parágrafo por que o seletor está considerando parágrafos que são irmãos.

Entende? Se você quer selecionar parágrafos que estão a partir do segundo li da lista, ai a regra seria pro li e não pro parágrafo, faz sentido?

Oi Laércio uma alternativa para selecionar todas as tags <p> com exceção da primeira seria utilizar a pseudoclasse NOT:

O código da seleção leva em consideração que queremos todos os parágrafos menos o que tem a clase inicio-post.A seleção ficaria assim:

p:not(.inicio-post){
    background-color: red;
}

Espero ter ajudado e bons estudos.

Ola Wanderson, tranquilo? Então referente a expressão que passei para o parâmetro, dei uma estudada melhor e acho que agora entendi como funciona, me corrija se estou errado mas pelo que entendi é que:

Se quisesse selecionar apenas de 2 em 2 seria por exemplo nth-of-type(2n), se quisesse selecionar de 2 em 2 apartir do 3 seria: (3n+2) algo assim? o número antes do n seria o start e o número depois do mais(+) seria de quantos em quantos eu desejo "pular"? Mas isso só vale para quando dois números são declarados, se no caso quisesse selecionar de 1 em 1 apartir do segundo seria (n+2) ?

Agora só fiquei perdido quando você disse "ai a regra seria pro li e não p/ o parágrafo", no caso eu quero selecionar o p dentro do li, e não o li.

Poderia me dar um exemplo de como ficaria meu seletor do jeito que você falou?

Outra coisa no caso você disse que o seletor está considerando p que são irmãos, então o seletor nth-of-type só olha um "nível" na hierarquia é isso? No caso para olhar todos os elementos dentro de determinado elemento seria o nth-child?

Obrigado, fico no aguardo!

Olá Maison, tudo bem?

Valeu aí pela sugestão, não conhecia essa pseudoclasse e no caso ela resolve meu problema. Porém eu estava só praticando o uso das pseudoclasses nth-.

Obrigado.

Opa, se você por só 2, vai selecionar apenas o segundo item. Pra você ter a progressão, você precisa colocar o "n". Então "n + 2" seleciona todos a partir do segundo. "2n + 2" seleciona um sim outro não a partir do segundo, faz sentido?

Agora sobre o seletor. Seus posts estão em uma lista com um único parágrafo dentro.

.blog p:nth-of-type(2n+1) {
    background-color: red;
}

O trecho de código acima vai selecionar o todos os primeiros parágrafos e depois vai pular de 2 em 2, mas você não tem mais parágrafos adjacentes.

Então, do jeito que o HTML está, você querendo selecionar os parágrafos que estão a partir do segundo item da lista o seletor seria mais ou menos esse:

.blog li:nth-of-type(n+2) p {
    background-color: red;
}

Opa valeu pela ajuda Wanderson, agora ficou claro!

Muito Obrigado, até a próxima.

Até a próxima! Bons estudos! Abraço.