我的页面上有很多内容，但我无法控制它在哪里中断。我在每个页面上使用 position:fixed 作为页眉/页脚放置了一些内容，但它与文本重叠。我尝试通过以下两种方式使用边距和填充来解决重叠问题。
当我使用@page添加边距时
@page {
margin: 2cm;
}
正如它所说，它适用于每个页面，但我的页眉和页脚也从边距中消失了。
所以我尝试使用 body 标签添加边距
body {
margin: 2cm;
/* padding: 2cm; */
}
它的工作原理是在第一页上添加 2 厘米的上边距，在最后一页上添加 2 厘米的下边距。但不在页面之间。
是否可以设置每页的边距/填充？
我遇到了完全相同的问题，经过大量搜索后，我发现了一篇有趣的文章，提供了一个组合解决方案，您可以阅读此处。
简而言之，它结合了两种方法：
使用
位置：固定技术使用
thead tbody tfoot如果您只使用第一种方法，您将面临重叠问题，同样，如果您只使用第二种方法，页脚将粘在页面内容的底部，可能会在最后一页的开头结束，但是结合使用这两种方法可以解决问题。
在这里您可以看到一个有效的演示。
为确保此解决方案正常工作，请尝试按
Print Me!按钮进行打印。您甚至可能需要在页脚中添加页码，这也是由CSS完成的，您只需要添加以下 CSS：
.page-footer:after { counter-increment: page; content: counter(page) }在一些文章中，它是
内容: counter(page) " of " counter(pages);，但是在我的例子中，pages无缘无故一直返回0，所以我忽略了它，也许你可以实现计数使用 CSS var() 计算总页数。郑重声明，如果您不想在打印前观察页眉和页脚，可以添加以下 CSS：
@media screen { .header, .footer { display: none; } }2020 年更新：
页码似乎不再起作用了。