html打印表格每页都有的表头和打印分页
本文转载: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=gb2312">
<title>无标题文档</title>
<style>
@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>表格内容</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>表格内容</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>表格内容</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>
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。