Applicare un effetto CSS solo ai primi 10 tag di un div

Come applicare un effetto CSS ai primi 10 tag <a> di un div?Applicare un effetto CSS solo ai primi 10 tag di un div

Questo è il mio approccio, ma credo che ci deve essere una soluzione migliore:

a:nth-child(1), a:nth-child(2), a:nth-child(3), a:nth-child(4), 
a:nth-child(5), a:nth-child(6), a:nth-child(7), a:nth-child(8), 
a:nth-child(9), a:nth-child(10){ color:#4faacb; }

fonte

2013-04-29 sanchitkhanna26

Sono abbastanza sicuro che sia disponibile un'opzione di intervallo. Non sono sicuro di quale tipo di supporto del browser ci sia in questo momento. –

Perché non utilizzare un ciclo JS per applicare una classe ai primi 10 collegamenti, quindi utilizzare quella classe come selettore? – 11684

a: nth-child (-n + 11) {color: # 4faacb} –

Credo che questo CSS dovrebbe fare il trucco

a:nth-child(-n+10) { color: #4faacb }

JSFiddle

Spero che questo aiuti

fonte

2013-04-29 13:35:20

Ottimo, funziona ... Fantastico – sanchitkhanna26

@RayZ contrassegnalo come accettato (spunta accanto al numero e alle frecce) in modo che altre persone possano trovare la soluzione! – Barney

Sicuramente ... Aspetto un momento – sanchitkhanna26

È possibile ottenere ciò utilizzando un nth-of-type formula in combinazione con not:

div > a:not(:nth-of-type(1n+11)){ 
    color: red; 
}

Demo here.

fonte

2013-04-29 13:36:28 Barney

O ': nth-of-type()' o ': nth-child()' funzionerà se ogni figlio di 'div' è garantito come' a'. – BoltClock

@BoltClock sì. – Barney

Applicare un effetto CSS solo ai primi 10 tag di un div

risposta

Problemi correlati