:nth-child(n) CSS selector

:nth-child(n) selector kan du benytte hvis du f.eks. er i gang med at lave en liste og vil have den første række til at have en anden baggrunds farve og hver anden række skal have forskellige baggrundsfarver.

<div id="liste">
   <div>
       <div>Min liste</div>
   </div>
   <div>
       <div>234</div>
   </div>
   <div>
       <div>345</div>
   </div>
</div>

Her er det tilhørende CSS

#liste div,
#liste div > div {
   float: left;
}
#list div > div:nth-child(1) {
   background: #dd0000;
}
#list div > div:nth-child(odd) {
   background: #fafafa;
}
#list div > div:nth-child(even) {
   background: #898989;
}

Lig mærke til at man i stedet for at definere et tal kan skrive odd for ulige og even for lige nummer rækker.

Du kan læse mere her