实例
<!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>
运行实例 »
点击 "运行实例" 按钮查看在线实例
手写代码: