Table row alternate background color or How can change alternate row background color
<style type="text/css">
table, th, td { width:500px; border:1px solid #ccc; border-collapse:collapse;}
table tr:nth-child(even) {
background-color: #e1e2e0;
}
table tr:nth-child(odd) {
background-color:#fff;
}
</style>
<div class="boxernew">
<table width="100%" border="0" align="center" cellpadding="4" cellspacing="0">
<tr class="theader">
<th align="center" valign="middle">Name</th>
<th align="center" valign="middle">Username</th>
<th align="center" valign="middle">Mobile</th>
<th align="center" valign="middle">Email</th>
</tr>
<tr>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
</tr>
</table>
</div>
<style type="text/css">
table, th, td { width:500px; border:1px solid #ccc; border-collapse:collapse;}
table tr:nth-child(even) {
background-color: #e1e2e0;
}
table tr:nth-child(odd) {
background-color:#fff;
}
</style>
<div class="boxernew">
<table width="100%" border="0" align="center" cellpadding="4" cellspacing="0">
<tr class="theader">
<th align="center" valign="middle">Name</th>
<th align="center" valign="middle">Username</th>
<th align="center" valign="middle">Mobile</th>
<th align="center" valign="middle">Email</th>
</tr>
<tr>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
</tr>
<tr>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
<td align="center" valign="middle"> </td>
</tr>
</table>
</div>
No comments:
Post a Comment