css分页打印时候表头表尾样式提取
css分页打印时候表头表尾样式提取:
<style>
@media print{
INPUT {display:none}
TABLE {border-collapse:collapse;font-size:12px;font-family:Arial, Helvetica, sans-serif;}
THEAD {display:table-header-group;font-weight:bold;}
THEAD TD{text-align:center;font-weight:bold;border:3px solid red;}
TBODY {text-align:center;}
TBODY TD{font-weight:bold;border:3px solid black;}
TFOOT {display:table-footer-group;font-weight:bold;}
TFOOT TD{text-align:center;font-weight:bold;border:3px solid blue;}
.page_break_after {page-break-after:always;}
}
</style>
<TABLE border="0" width="300px" align="center">
<THEAD>
<TR><TD colspan="2">每页都有的表头</TD>
</TR>
</THEAD>
<TBODY>
<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 class="page_break_after"><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 class="page_break_after"><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 class="page_break_after"><TD>表格内容</TD><TD>表格内容</TD></TR>
</TBODY>
<TFOOT>
<TR>
<TD colspan="2">每页都有的表尾</TD>
</TR>
</TFOOT>
</TABLE>
<input type=button value=" 打 印 " onclick="window.print()">