Selector de CSS para otro que no sea el primer hijo y el último hijo

105

Estoy haciendo un sitio web muy avanzado. Mi pregunta: ¿Es posible seleccionar todos los demás hijos excepto el :first-childy el :last-child? Sé que hay un :not()selector, pero no funciona con más de uno que no esté entre paréntesis. Esto es lo que tengo:

#navigation ul li:not(:first-child, :last-child) {
    background: url(images/UISegmentBarButtonmiddle@2x.png);
    background-size: contain;
}

html css css-selectors

— Daniel
fuente

Eres muy valiente para usar esto. Tenga en cuenta que solo funcionará en navegadores modernos, y definitivamente no funcionará en el anti-navegador que todos están usando.

— librado el

@Radu: "Estoy creando un sitio web muy avanzado" No es de extrañar ...

— BoltClock

@BoltClock, cierto, solo digo ... Palabra de advertencia. Pero de todos modos, si el objetivo es iOS Safari como sugiere el nombre de la imagen, entonces debería ser seguro.

— librado el

Ahora veo por qué esta pregunta me parece tan familiar ... stackoverflow.com/questions/7403129/combining-not-selectors

— BoltClock

"anti-navegador"? ¿Es ese el nuevo Google Ultron del que sigo escuchando?

— Jonathan Dumaine

Respuestas:

262

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

— Salman von Abbas
fuente

¡ERES INCREIBLE! ¡Gracias!

— Daniel

rofl, la estupidez de mi not()incluso intentar esto antes de buscar en Google: P genius

— SidOfc

Eso está mal: not (A and B)no es igual a (not A) and (not B), preferiría serlo (not A) or (not B). No funciona.

— Hibou57

No, lo que dijo Salman Abbas es correcto. Estás pensando en la coma; #navigation ul li: not (: primer hijo), #navigation ul li: not (: last-child)

— user847074

Seguro que funcionará, solo tienes que usar dos selectores "no".

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

Continuará en la línea después del primero, diciendo "no el primer hijo" y "no el último hijo".

— animuson
fuente