上一个文章中介绍了table(表格)的一些基本属性,但是制作出来的是边框挺不美观的如下:
在补充两个属性:
colspan 水平方向单元格的合并
rowspan 上线方向单元格的合并
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table border="1" width="400" height="300" align="center" >
<thead>
<tr>
<th colspan="3">学生成绩</th>
</tr>
</thead>
<script href=""></script>
<tbody>
<tr>
<td rowspan="2" align="center">张三</td>
<td>语文</td>
<td>98</td>
</tr>
<tr>
<td>数学</td>
<td>95</td>
</tr>
<tr>
<td>李四</td>
<td>语文</td>
<td>88</td>
</tr>
<tr>
<td>李四</td>
<td>数学</td>
<td>91</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3">表格底部</td>
</tr>
</tfoot>
</table>
</body>
</html>
这是可以使用cellspacing,
cellspacing:用来指定表格各单元格之间的空隙。此属性的参数值是数字,表示单元格间隙所占的
像素点数。
<table style ="border-collapse: collapse" cellspacing =0 border="1" width="400" height="300" align="center">