Sélecteur CSS pour autre que le premier enfant et le dernier enfant

105

Je crée un site Web très avancé. Ma question: est-il possible de sélectionner tous les autres enfants sauf le :first-childet le :last-child? Je sais qu'il y a un :not()sélecteur mais cela ne fonctionne pas avec plus d'un qui n'est pas entre parenthèses. Voici ce que j'ai:

#navigation ul li:not(:first-child, :last-child) {
    background: url(images/UISegmentBarButtonmiddle@2x.png);
    background-size: contain;
}
html css css-selectors Daniel
la source
Vous êtes très courageux pour utiliser cela. Notez que cela ne fonctionnera que sur les navigateurs modernes et que cela ne fonctionnera certainement pas sur l'anti-navigateur que tout le monde utilise.
débarrassé
2
@Radu: "Je crée un site Web très avancé" Pas de surprise là-bas ...
BoltClock
1
@BoltClock, d'accord, je dis juste ... Un mot d'avertissement. Mais de toute façon, si la cible est le Safari iOS comme le nom de l'image l'indique, alors cela devrait être sûr.
débarrassé
1
Maintenant, je vois pourquoi cette question semble si familière ... stackoverflow.com/questions/7403129/combining-not-selectors
BoltClock
"anti-navigateur"? Est-ce le nouveau Google Ultron dont j'entends toujours parler?
Jonathan Dumaine

Réponses:

262

Essayez #navigation ul li:not(:first-child):not(:last-child).

Salman von Abbas
la source
VOTRE GÉNIAL! Merci!
Daniel
1
rofl, la stupidité de moi not()même en essayant cela avant de googler: P genius
SidOfc
1
C'est faux: not (A and B)n'est pas égal à (not A) and (not B), ce serait plutôt (not A) or (not B). Ça ne marche pas.
Hibou57
2
Non, ce que Salman Abbas a dit est juste. Vous pensez à la virgule; #navigation ul li: not (: first-child), #navigation ul li: not (: last-child)
user847074
20

Bien sûr, cela fonctionnera, il vous suffit d'utiliser deux sélecteurs «non».

#navigation ul li:not(:first-child):not(:last-child) {

Il continuera sur toute la ligne après le premier, en disant "pas le premier enfant" et "pas le dernier enfant".

animuson
la source