7
votes

CSS Nth-enfant 1-6, 7-12, etc.

Je tente de styliser des objets enfants comme suit

1,7,13, etc

2,8,14, etc

3,9,15, etc

4,10,16, etc

5,11,17, etc

6,12,18, etc

Quelle syntaxe de Nth-enfant puis-je utiliser pour y parvenir?


0 commentaires

3 Réponses :


10
votes

Vous pouvez utiliser : Nth-enfant (6n + 1) , : Nth-enfant (6n + 2) , : Nth-enfant (6n + 3) , : Nth-enfant (6n + 4) etc ..

Références: http://w3.org/tr/css3-Selectors / # Nth-enfant-pseudo , http://w3.org/tr/ CSS3-SELECTORS / # SÉLECTEURS (Merci @nayukiminase)

En outre, un très bon exemple est ici: utile: Nth-enfant Recettes - CSS-Tricks



2
votes

Lire l'explication Comment Nth-enfant Works ici .

Vous pouvez utiliser 6N + X, où vous devez insérer des numéros appropriés pour X.


0 commentaires

1
votes

Utilisez cette équation simple: ND + A fort>

here a : first element index
     n : n
     d : difference

Example: 1,7,13
here a : 1
     n : n
     d : 6
    So the pseudo selector will be :nth-child(6n + 1)


0 commentaires