实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格</title>
<style>
td img{
width:40px;
height: 40px;
border-radius: 50%;
}
table,th,td{
border:1px solid #333;
}
th,td{
padding:10px;
}
table{
border-collapse: collapse;
margin: 50px auto;
text-align: center;
width: 60%;
box-shadow: 10px 10px 5px #888888;
}
caption{
color:red;
font-size: 1.6em;
margin-bottom: 10px;
}
</style>
</head>
<body>
<table>
<caption>培训班学生登记表</caption>
<tr>
<th colspan="3">基本信息</th>
<th colspan="2">其他信息</th>
</tr>
<tr>
<th>姓名</th>
<th>头像</th>
<th>年龄</th>
<th>作业</th>
<th>成绩</th>
</tr>
<tr>
<td>张大大</td>
<td><img src="../images/1.jpg" alt=""></td>
<td>23</td>
<td>完成</td>
<td>优秀</td>
</tr>
<tr>
<td>李啊啊</td>
<td><img src="../images/3.jpg" alt=""></td>
<td>22</td>
<td>未完成</td>
<td>不及格</td>
</tr>
<tr>
<td>朱珊珊</td>
<td><img src="../images/4.jpg" alt=""></td>
<td>44</td>
<td>完成</td>
<td>及格</td>
</tr>
</table>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
手写代码：
![]5@W(ZOLY@$M)}ZLX3]]$RO.png](https://img.php.cn//upload/image/673/356/481/1521973602280638.png "1521973602280638.png")
