chanigng color of rowx in table - php

Question

hello i am working on the styling of table in PHP . I am stuck at only one point that i am not able to to change the colors of the rows of my table alternatively like odd rows should be displayed with white background and even with blue . i trie the followng css code but it didnot worked
tbody:nth-child(2n) { /* even rows */
background-color:#eee;
}
tbody:nth-child(2n+1) { /* odd rows */
background-color:#ccc;
}

Answer 1

If it is not because of your browser issue, please try this for css
table#tableid tr:nth-child(2n) { /* even rows */
background-color:#eee;
}
table#tableid tr:nth-child(2n+1) { /* odd rows */
background-color:#ccc;
}
OR
table#tableid tr:nth-child(even) { /* even rows */
background-color:#eee;
}
table#tableid tr:nth-child(odd) { /* odd rows */
background-color:#ccc;
}

Answer 2

i think jquery :even and :odd selector is the best option for cross browsers..
$('#selector:even').addClass('even_class');
$('#selector:odd').addClass('odd_class');

Answer 3

Write two classes to for the styles of odd and even rows. And add the class alternately like this.
.odd_row{
background-color:grey;
}
.even_row{
background-color:white;
}
And in php,
<?php
for($i=0;$i<10;$i++)
{?>
<tr class="<?php echp ($i%2==0)?'odd_row':'even_row';?>">
<td>data1</td>
<td>data2</td>
</tr>
<?php
}
?>

Answer 4

Perhaps you could try using a variable to change which style is used. So when you start the block, you define oddOrEven as 0, then you echo a row, then you set oddOrEven to 1. Every time a row is echoed, it changes which class is used based on oddOrEven.