本文转自：http://www.cnblogs.com/RitchieChen/archive/2008/07/30/1256829.html
在做项目的时候碰到的。用户要求，页面呈现太长时，打印的时候，要求，每页上都要有表头。找了好久，才在网上找到。原来，是要对每个表格，定义其thead，并对其样式设置成：style="display:table-header-group"。如果要求有表尾，也一样，要定义其tfoot，并对style="display:table-footer-group"
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style type="text/css">
@media print {
INPUT {
display: none;
}
}
</style>
</head>
<body>
<table border="0" style="font-size: 9pt;" width="300px" align="center">
<thead style="display: table-header-group; font-weight: bold">
<tr>
<td colspan="2" align="center" style="font-weight: bold; border: 3px double red">每页都有的表头</td>
</tr>
</thead>
<tbody style="text-align: center">
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr style="page-break-after: always;">
<td>表格内容1</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr style="page-break-after: always;">
<td>表格内容2</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr>
<td>表格内容</td>
<td>表格内容</td>
</tr>
<tr style="page-break-after: always;">
<td>表格内容3</td>
<td>表格内容</td>
</tr>
</tbody>
<tfoot style="display: table-footer-group; font-weight: bold">
<tr>
<td colspan="2" align="center" style="font-weight: bold; border: 3px double blue">每页都有的表尾</td>
</tr>
</tfoot>
</table>
<input type="button" value=" 打 印 " onclick="javascript: window.print();">
</body>
</html>
1314
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
