double row selector

by SebastianPataneMasuelli

HTML

<table id="table" border="1" cellpadding="3" cellspacing="3" width="300">
     <tr>
        <td>sval</td>
        <td>--</td>
    </tr>
    <tr>
        <td>--</td>
        <td>---</td>
    </tr>
     <tr>
        <td>sval</td>
        <td>--</td>
    </tr>
    <tr>
        <td>--</td>
        <td>---</td>
    </tr>
     <tr>
        <td>sval</td>
        <td>--</td>
    </tr>
    <tr>
        <td>--</td>
        <td>---</td>
    </tr>
</table>

CSS

tr:nth-child(2n + 1){ background-color: red } 
tr:nth-child(2n + 2){ background-color: red } 
tr:nth-child(2n + 3){ background-color: pink }
tr:nth-child(2n + 4){ background-color: pink }
tr:nth-child(2n + 5){ background-color: red }
tr:nth-child(2n + 6){ background-color: red }

/*
tr:nth-child(n +1) + tr { background-color: pink } 
*/



/*
tr:nth-of-type(even) { background-color: pink }
tr:nth-of-type(even) + tr { background-color: pink !important } 


tr:nth-of-type(1n + 2 ) + tr { background-color: blue }

tr:nth-child(odd) 
*/