en utilisant: pas pour le premier enfant + toutes les 3 donc après

Question

Essayer de comprendre comment je peux attaquer certains li selon la position. Essentiellement, je dois NOT cibler soit le premier enfant, puis tous les 3 après.

Exemple:

li1 (dont target) | li4(dont target) | li7 (dont target) 
li2 (target)  | li5 (target)  | li8 (target) 
li3 (target)  | li6 (target)  | li9 (target) 

Voici ce que j'ai essayé jusqu'à présent:

.siteMapSubList.threecolumn > li:not(:nth-child(1n+3))

le nom de classe est hors de propos, ainsi que le code css Je suis mise en œuvre, donc je n'a pas inclus cela. Cependant, cela ne fonctionne pas. Comme dans, ne cible pas ceux que j'essaie de cibler. J'essaie VRAIMENT d'éviter d'avoir 2 règles différentes (dont une ne cible pas le premier enfant et ensuite tous les 3 après) que je pense pouvoir faire maintenant. Donc, je veux vraiment faire cela en une seule règle, si possible.

EDIT

Vous voulez que les gens comprennent ce que je dois mieux. Donc, essentiellement, si nous avons 9 li, je ne veux pas cibler 1, 4 et 7. 2,3,5,6,8,9 Je veux cibler (ce qui explique pourquoi je n'utilise pas un opérateur, mais si vous avez une meilleure façon, je suis tout ouïe).

Answer 1

Vous étiez très proche! Le sélecteur dont vous avez besoin est li:not(:nth-child(3n+1)).

Voir exemple ci-dessous:

ul { 
 
    display: flex; 
 
    flex-direction: column; 
 
    flex-wrap: wrap; 
 
    height: 6em; 
 
} 
 

 
li { 
 
    height: 2em; 
 
} 
 

 
li:not(:nth-child(3n+1)) { 
 
    color: red; 
 
}

<ul> 
 
    <li>1</li> 
 
    <li>2</li> 
 
    <li>3</li> 
 
    <li>4</li> 
 
    <li>5</li> 
 
    <li>6</li> 
 
    <li>7</li> 
 
    <li>8</li> 
 
    <li>9</li> 
 
</ul>