<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
table{
width: 100%;
font-size: 12px;
margin: 0 auto;
border: 1px solid #cad9ea;
color:#666;
table-layout: fixed;//改善表格呈现性能
empty-cells: show;//隐藏不必要的干扰因素
border-collapse: collapse;//让表格看起来更精致
}
th{
border: 1px solid #cad9ea;
padding: 0 1em 0;//其实这里加了一个背景图片
}
td {
height: 20px;
border: 1px solid #cad9ea;
padding: 0 1em 0;
}
tr:nth-child(even) {//实现隔行分色。
background-color: #f5fafe;
}
</style>
</head>
<body>
<table>
<tr>
<th>num</th>
<th>num</th>
<th>num</th>
<th>num</th>
<th>num</th>
</tr>
<tr>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
</tr>
<tr>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
</tr>
<tr>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
</tr>
<tr>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
</tr>
<tr>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
<td>123</td>
</tr>
</table>
</body>
</html>
