DataTables

DataTables Examples

HTML

<link rel="stylesheet" href="http://cdn.datatables.net/1.9.4/css/jquery.dataTables.css">
<script src="http://cdn.datatables.net/1.9.4/js/jquery.dataTables.min.js"></script>
<table class="dataTable" id="example">
    <thead>
        <tr>
            <th>Rendering engine</th>
            <th>Browser</th>
            <th>Platform(s)</th>
            <th>Engine version</th>
            <th>CSS grade</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Trident</td>
            <td>Internet
                 Explorer 4.0</td>
            <td>Win 95+</td>
            <td> 4</td>
            <td>X</td>
        </tr>
        <tr>
            <td>Trident</td>
            <td>Internet
                 Explorer 5.0</td>
            <td>Win 95+</td>
            <td>5</td>
            <td>C</td>
        </tr>
        <tr>
            <td>Trident</td>
            <td>Internet
                 Explorer 5.5</td>
            <td>Win 95+</td>
            <td>5.5</td>
            <td>A</td>
        </tr>
        <tr>
            <td>Trident</td>
            <td>Internet
                 Explorer 6</td>
            <td>Win 98+</td>
            <td>6</td>
            <td>A</td>
        </tr>
        <tr>
            <td>Trident</td>
            <td>Internet Explorer 7</td>
            <td>Win XP SP2+</td>
            <td>7</td>
            <td>A</td>
        </tr>
        <tr>
            <td>Trident</td>
            <td>AOL browser (AOL desktop)</td>
            <td>Win XP</td>
            <td>6</td>
            <td>A</td>
        </tr>
        <tr>
            <td>Gecko</td>
            <td>Firefox 1.0</td>
            <td>Win 98+ / OSX.2+</td>
            <td>1.7</td>
            <td>A</td>
        </tr>
        <tr>
            <td>Gecko</td>
            <td>Firefox 1.5</td>
            <td>Win 98+ / OSX.2+</td>
            <td>1.8</td>
            <td>A</td>
        </tr>
        <tr>
            <td>Gecko</td>
            <td>Firefox 2.0</td>
           ...

CSS

table.dataTable tbody td:first-child {
   border-left: 1px solid lime;
   border-top: 1px solid lime;
}
table.dataTable td:last-child {
   border-right: 1px solid lime;
   border-top: 1px solid lime;
}
table.dataTable tbody td:not(:first-child):not(:last-child) {
   border-top: 1px solid lime;
   border-left: 0px;
   border-right: 0px;  
}
table.dataTable thead th {
    border-bottom: 1px solid lime;
}    
table.dataTable tbody tr:last-child td {
    border-bottom: 1px solid lime;
}    
table.dataTable tbody td {
    background-color: yellow;
}

JavaScript

var table = $('#example').dataTable({
    asStripeClasses : []
});