Table Stripes (Zebra) - Jquery
Table Stripes
Snippet Code
Rate this page :
|
[ 0 votes]
|
//Adding the JavaScript
$(document).ready(function(){
$("table tr:even").addClass('stripe');
});
//Adding the HTML
<table border="0" cellspacing="0" cellpadding="0" class="stipe">
<tr>
<th>aaa</th>
<th>bbb</th>
</tr>
<tr>
<td>ccc</td>
<td>ddd</td>
</tr>
<tr>
<td>eee</td>
<td>fff</td>
</tr>
<tr>
<td>Ipsum</td>
<td>Ipsum</td>
</tr>
</table>
//Adding the CSS
body{
background: #111111;
}
table {
width: 585px;
background: #333;
color: #999;
font-family: Georgia, "Times New Roman", serif;
letter-spacing: -1px;
font-style: italic;
margin: 150px auto;
}
table tr {
height: 45px;
text-indent: 20px;
}
.stripe {
background: #444
}
table th {
background: #004d99;
color: #fff;
font-family: Arial, Helvetica, sans-serif;
font-style: normal;
text-align: left;
}
