Come posso usare un selettore no: first-child?

Question

Ho tag div contenente diversi tag ul.

Se io cercando di impostare le proprietà CSS solo per il primo ul tag, e questo codice funziona:

div ul:first-child { 
    background-color: #900; 
} 

quando voglio impostare le proprietà CSS per ogni ul tag eccetto il primo, ho provato questo:

div ul:not:first-child { 
    background-color: #900; 
} 

anche questo:

div ul:not(:first-child) { 
    background-color: #900; 
} 

e questo:

div ul:first-child:after { 
    background-color: #900; 
} 

Ma a nessun effetto. Come devo scrivere in CSS: "ogni elemento, tranne il primo"?

Answer 1

Una delle versioni che hai postato actually works per tutti i browser moderni (dove CSS selectors level 3 sono supported):

div ul:not(:first-child) { 
    background-color: #900; 
} 

Se è necessario supportare i browser legacy, o se si sono ostacolati dal selettore del limitation:not (solo accetta un simple selector come argomento) quindi è possibile utilizzare un'altra tecnica:

Definire una regola che ha un ambito maggiore rispetto a quello che si intende e quindi "revocarla" in modo condizionale, limitando il suo ambito a ciò che si intende:

div ul { 
    background-color: #900; /* applies to every ul */ 
} 

div ul:first-child { 
    background-color: transparent; /* limits the scope of the previous rule */ 
} 

Quando limitando la portata utilizzare il default value per ciascun attributo CSS che si sta impostando.

Answer 2

Beh visto :not non è accettato da IE6 ~ 8, vorrei suggerire questo:

div ul:nth-child(n+2) { 
    background-color: #900; 
} 

Quindi cogliere ogni ul nel suo elemento genitore eccezione della prima.

riferimento all'articolo "Useful :nth-child Recipes" di Chris Coyer per più nth-childexamples.

Answer 3

Questa soluzione CSS2 ("qualsiasi ul dopo un altro ul") funziona anche ed è supportata da altri browser.

div ul + ul { 
    background-color: #900; 
} 

differenza :not e :nth-sibling, il adjacent sibling selector è supportato da IE7 +.

Se hai JavaScript cambia queste proprietà dopo il caricamento della pagina, si dovrebbe guardare alcuni bug noti nel IE7 e IE8 implementazioni di questo. See this link.

Per qualsiasi pagina Web statica, questo dovrebbe funzionare perfettamente.

Answer 4

div li~li { 
    color: red; 
} 

Supporta IE7

Answer 5

not(:first-child) sembra non funzionare più. Almeno con le versioni più recenti di Chrome e Firefox.

Invece, provate questo:

ul:not(:first-of-type) {}