<!DOCTYPE html>
<html lang="en">
<head>
<title>快捷table样式</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type="text/css">
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:10px}
.ss-table{border-collapse:collapse;border-spacing:0;empty-cells:show;border:1px solid #cbcbcb}
.ss-table caption{color:#000;font:italic 85%/1 arial,sans-serif;padding:1em 0;text-align:center}
.ss-table td,.pure-table th{padding:0;border-left:1px solid #cbcbcb;border-0 0 0 1px;font-size:inherit;margin:0;overflow:visible;padding:.5em 1em}
.ss-table thead{background-color:#e0e0e0;color:#000;text-align:left;vertical-align:bottom}
.ss-table td{background-color:transparent}
.ss-table tr:nth-child(odd) td{background-color:#f2f2f2}
.ss-table tr:hover td{background-color:antiquewhite}
</style>
</head>
<body>
<table class="ss-table">
<thead>
<tr>
<th>#</th>
<th>Make</th>
<th>Model</th>
<th>Year</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Honda</td>
<td>Accord</td>
<td>2009</td>
</tr>
<tr>
<td>2</td>
<td>Toyota</td>
<td>Camry</td>
<td>2012</td>
</tr>
<tr>
<td>3</td>
<td>Hyundai</td>
<td>Elantra</td>
<td>2010</td>
</tr>
<tr>
<td>4</td>
<td>Ford</td>
<td>Focus</td>
<td>2008</td>
</tr>
<tr>
<td>5</td>
<td>Nissan</td>
<td>Sentra</td>
<td>2011</td>
</tr>
<tr>
<td>6</td>
<td>BMW</td>
<td>M3</td>
<td>2009</td>
</tr>
<tr>
<td>7</td>
<td>Honda</td>
<td>Civic</td>
<td>2010</td>
</tr>
<tr>
<td>8</td>
<td>Kia</td>
<td>Soul</td>
<td>2010</td>
</tr>
</tbody>
</table>
</body>
</html>