<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>年终数据报表</title>
<style>
.table1{
width:100%; //相对于整个页面宽度占100%
height:auto; //高度自动
}
.table1 thead tr{
background-color:#CC0;
}
.table1 tbody tr th{
background-color:#CC6;
width:20%; //相对于表格宽度占20%
}
.table1 tbody tr td{
background-color:#CCC;
}
.table1 tfoot tr th{
background-color:#CC6;
}
.table1 tfoot tr td{
background-color:#CCC;
}
</style>
</head>
<body>
<table class="table1">
<thead>
<tr>
<th colspan="5">年终数据报表</th>
</tr>
</thead>
<tbody>
<tr>
<th></th>
<th>1月</th>
<th>2月</th>
<th>3月</th>
<th>小计(RMB)</th>
</tr>
<tr>
<th>天津</th>
<td>10</td>
<td>26</td>
<td>50</td>
<td>86</td>
</tr>
<tr>
<th>北京</th>
<td>40</td>
<td>30</td>
<td>50</td>
<td>120</td>
</tr>
<tr>
<th>上海</th>
<td>20</td>
<td>10</td>
<td>30</td>
<td>60</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>总计(RMB)</th>
<td>70</td>
<td>66</td>
<td>130</td>
<td>266</td>
</tr>
</tfoot>
</table>
</body>
</html>
表格分组标签的使用
最新推荐文章于 2024-04-07 08:30:00 发布