CSS nth-child - obtenez les 1er, 2e, 4e et 5e enfants en même temps?

Avec CSS3 je sais que je peux utiliser le nth-child(an + b) sélecteur. J'ai une table avec 5 lignes et je voudrais sélectionner les 1er, 2e, 4e et 5e lignes avec une seule instruction. Est-ce possible ou dois-je utiliser un minimum de deux états comme ceci:

:nth-child(-n+2)  /* gets 1 and 2 */
:nth-child(n+4)   /* gets 4 and 5 */

J'espérais une syntaxe comme nth-child(1,2,4,5) ou nth-child(1-2,4-5) mais il ne semble pas faire partie de la spécification.

(Je n'ai pas de contrôle sur la page et il n'y a aucune Id/classes sur ces lignes.)

source d'informationauteur Chad

  1. 20

    Si vous voulez être explicite, le seul moyen est de répéter :nth-child() comme suit:

    tr:nth-child(1), tr:nth-child(2), tr:nth-child(4), tr:nth-child(5)

    Cependant, depuis la table arrive à avoir exactement 5 lignes, vous pouvez juste exclure la troisième ligne et vous obtiendrez les lignes #1, #2, #4 et #5:

    tr:not(:nth-child(3))

    jsFiddle aperçu

  2. 2

    Vous pouvez toujours utiliser des pairs et impairs, les mots clés
    Comme:

    table tr:nth-child(même) ou si vous souhaitez que le tableau d'utilisation des données de la table td:nth-child(odd)

  3. 1

    Pour le rendre le plus générique possible, vous pouvez utiliser ceci: 

    tr:not(:nth-child(1n+6)):not(:nth-child(3))  { 
    /* your rules here */
}

    Pour expliquer un peu:
    vous dites que vous voulez sélectionner les éléments qui sont pas de 6 (donc les 5 premiers) et pas 3ème, si vous avez écrit 

     tr:nth-child(1n+6)

    vous ont été ciblant les lignes à partir de 5 sur les, depuis que vous avez été en sélectionnant les lignes

    (1*0) + 6 [ = 6 ]

    (1*1) + 6 [ = 7 ]

    (1*2) + 6 [ = 8 ]

    ...et ainsi de suite. C'est ce que signifie l'expression (1n+X), où X dans notre cas est de 6.

    Ajout le :pas de pseudo-sélecteur pour l'expression ci-dessus, vous dites que vous voulez sélectionner les lignes qui sont pas de 5 sur de sorte que vous sélectionnez à partir de 5 vers le bas, le 1er, 2ème, 3ème, 4ème et 5ème.

    De Plus, ajouter un de plus :pas de sélecteur, qui vise la 3e, vous obtiendrez ce que vous voulez => Les 5 premiers sans la 3e!

    /***************** Mis à JOUR! J'ai ajouté un jsfiddle *******************/

    Ici vous pouvez le voir travailler dans ce jsfiddle