摘要:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">&
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>表格标签table</title>
<style>
* {
margin: 0px;
padding: 0px;
}
table {
border: 1px solid #ccc;
border-collapse: collapse;
}
tr td {
height: 50px;
border: 1px solid #ccc;
width: 100px;
}
th {
height: 50px;
border: 1px solid #ccc;
width: 100px;
}
tr td#over{
height: 50px;
border: 1px solid#ccc;
width: 100px;
text-align: center
}
</style>
</head>
<body>
<table>
<tr>
<th>课程表</th>
<th>星期一</th>
<th>星期二</th>
<th>星期三</th>
<th>星期四</th>
<th>星期五</th>
<th>星期六</th>
<th>星期日</th>
</tr>
<tr>
<!-- 合并行 rowspan -->
<td rowspan="3">上午</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td rowspan="2">下午</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<!-- 合并列 colspan -->
<td id="over" colspan="8">放学</td>
</tr>
</table>
</body>
</html>
批改老师:天蓬老师批改时间:2019-01-23 09:00:41
老师总结:表头放到<thead>中, 主体放在<tbody>中比较好, 特别是<tbody>不要省略, 就算是你不写, 浏览器也会自动生成, 如果省略掉了, 那么在用js获取表格数据时会出错