我有这个 html:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test</title>
<style type="text/css">
table {
page-break-inside: auto;
margin-top: 50mm;
margin-bottom: 50mm;
}
tr { page-break-inside: auto; page-break-after: auto }
thead { display: table-header-group;}
tfoot { display: table-footer-group;}
#header {
position: fixed;
width: 100%;
top: 0;
left: 0;
right: 0;
}
#footer {
position: fixed;
width: 100%;
bottom: 0;
left: 0;
right: 0;
}
</style>
</head>
<body>
<div id="header">
<p>Personalised header</p>
</div>
<div id="footer">
<p>Personalised footer</p>
</div>
<table>
<thead>
<tr><th>heading</th></tr>
</thead>
<tfoot>
<tr><td>notes</td></tr>
</tfoot>
<tbody>
<tr>
<td>x</td>
</tr>
<tr>
<td>x</td>
</tr>
<tr>
<td>x</td>
</tr>
<tr>
<td>x</td>
</tr>
<!-- Mor than 500 similar tr-->
<tr>
<td>x</td>
</tr>
</tbody>
</table>
</body>
</html>
这是一张大 table 。 表格有上边距和下边距，但只在第一个打印页应用 margin-top，在最后一个打印页应用 margin-bottom:
我该如何解决这个问题？我想要页面页眉和页脚的固定位置，但我想要的表格边距适用于所有打印页面。
最佳答案
您可以像这样使用@page 选择器在页面周围添加间距:
@page { margin: 50px }
关于html - 打印的 HTML 表格不在所有页面中应用边距，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51102329/