selezionare gli ultimi 3 childs

Question

So che è possibile selezionare l'ultimo chill con :last-child. ora ho bisogno di selezionare gli ultimi 3 bambino l'unico problema è la quantità di bambino Non è sapere quindi non posso usare :nth-child, so che c'è qualcosa che si chiama :nth-last-child ma i cant davvero a capire come questo sta lavorando

<div id="something"> 

    <a href="images/x.jpg" ><a/> 
    <a href="images/x.jpg" ><a/> 
    <!-- here some more 

    and than i need to select these --> 
    <a href="images/x.jpg" ><a/> 
    <a href="images/x.jpg" ><a/> 
    <a href="images/x.jpg" ><a/> 

</div> 

così ora ho bisogno di qualche cosa come questa:

#something a:last-child{ 
    /* only now it needs to select 2 more a's that are before this child */ 
} 

Answer 1

Si può leggere di più here su nth-ultimo figlio, ma questo dovrebbe in sostanza fare il trucco di selezionare gli ultimi 3 bambini con un solo CSS

#something a:nth-last-child(-n+3) { 
    /*declarations*/ 
} 

fiddle dimostrazione da Fabrício Matté

Questo selezioneremo solo quelle righe che restituiscono un numero positivo per l'espressione N out (-n + 3), e dal momento che stiamo usando nth-last-child, sta contando dall'ultimo al primo, quindi le prime righe dal basso danno,

f(n) = -n+3 
f(1) = -1+3 = 2 <- first row from the bottom 
f(2) = -2+3 = 1 <- second row from the bottom 
f(3) = -3+3 = 0 <- third row from the bottom 

tutto il resto restituirà un numero negativo

Answer 2

questo è possibile con selettori CSS3 e formulas:

.something a:nth-last-child(-n+3) { ... } 

Puoi provare anche using jQuery (example) o aggiungere una classe specifica agli ultimi tre elementi nel codice lato server (non richiede JavaScript per essere abilitato nei browser e funziona anche su browser meno recenti che non supportano CSS3).