Create Stylish HTML Table using CSS

 Creating Table using CSS really simple and more useful to maintain consistence through out Website.

     see the below Html code and CSS code

      HTML Code :
      ===========

  <div class="TableCSS">
<table>
<tr>
<td>Row 1 Col 1</td><td>Row 1 Col 2</td><td>Row 1 Col 3</td><td>Row 1 Col 4</td>
</tr>
<tr>
<td>Row 2 Col 1</td><td>Row 2 Col 2</td><td>Row 2 Col 3</td><td>Row 2 Col 4</td>
</tr>
<tr>
<td>Row 3 Col 1</td><td>Row 3 Col 2</td><td>Row 3 Col 3</td><td>Row 3 Col 4</td>
</tr></table>
</div>


CSS Code :
=========

.TableCSS{ margin : 0px;padding : 2px;}
.TableCSS table{ border-collapse: collapse;}
.TableCSS td{vertical-align:middle;    border:1px solid #000000; }   
.TableCSS tr:nth-child(even){ background-color:D2EDF3; }
.TableCSS tr:nth-child(odd) { background-color:#ffffff; }
.TableCSS tr:hover td {background-color:#E0FFFF;}
.TableCSS tr:first-child { background-color:#52CDEB;}


Happy Coding :)