html5表格美化代码

以下是一个简单的HTML5表格美化代码：

<table>
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>25</td>
<td>男</td>
</tr>
<tr>
<td>李四</td>
<td>30</td>
<td>女</td>
</tr>
<tr>
<td>王五</td>
<td>40</td>
<td>男</td>
</tr>
</tbody>
</table>

以下是相应的CSS样式代码：

table {
border-collapse: collapse;
width: 100%;
margin: 0;
padding: 0;
font-size: 16px;
color: #333;
border: 1px solid #ddd;
}

th, td {
text-align: left;
padding: 8px;
}

thead th {
background-color: #f2f2f2;
color: #666;
font-weight: normal;
border-bottom: 2px solid #ddd;
}

tbody tr:nth-of-type(even) {
background-color: #f2f2f2;
}

tbody td {
border-bottom: 1px solid #ddd;
}

tbody td:last-child {
border-bottom: none;
}

以上代码将表格的样式设置为具有一致的边框和背景色，并且交替行具有不同的背景色。通过设置thead和tbody元素的样式，我们可以对表格头部和主体进行不同的样式设置。