我网站的用户需要能够打印包含第一页打印页面上的内容的网页,然后是第二页上的表格.精简版是(jsFiddle at https://jsfiddle.net/jaydeedub/n3qhvtvx/25/):
HTML:
<body>
<button class="button" onclick="window.print()">Print Me</button>
<div class="page1">
This is the page 1 content. Blah, blah, blah.
</div>
<table class="table">
<thead>
<tr>
<td>Page 2 table header prints twice</td>
</tr>
</thead>
<tbody>
<tr>
<td>Page 2 table body</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Page 2 table footer</td>
</tr>
</tfoot>
</table>
</body>
CSS:
@media print {
div.page1 {
page-break-after: always;
}
}
.table {
border-collapse: collapse;
margin: 16px;
}
.table>thead>tr>td,
.table>tbody>tr>td,
.table>tfoot>tr>td {
border: 1px solid black;
}
.button { …