Há possibilidade de pintar 3 linhas sim e 3 linhas não com nth-child?
Há possibilidade de pintar 3 linhas sim e 3 linhas não com nth-child?
Oi Flavio, tudo bom?
Dá sim! Além dos valores ali de par e ímpar, podemos usar o N (enésimo), algo assim:
li:nth-child(3n) {
color: red;
}
O N ali dentro começa em 0, e vai sendo acrescido de 1 enquanto tiverem elementos, no caso acima de LIs.
3n = 3 . 0 = 0
3n = 3 . 1 = 3
3n = 3 . 2 = 6
E assím vai!
Abcs!
Dessa forma ele só pinta a cada terceiro, ou seja, o primeiro e o segundo não pinta, o terceiro pinta, na verdade quero pintar 3 corridos e 3 sem pintar seguidos.
Oi Flavio,
Pedi ajuda para outro instrutor aqui (pensei em soluções tentando envolver o :not mas sem sucesso).
O ponto é que com uma regra só fica impossível bem difícil fazer isso, então ele resolveu da seguinte maneira:
li:nth-child(6n + 1),
li:nth-child(6n + 2),
li:nth-child(6n + 3){
color: red;
}
Abcs!