Question

我正在尝试制作一个HTML报告，该报告在打印时将在每个页面上有一个自定义标题，并以表格的形式显示正文内容。页脚是可选的。

环顾四周后，使用

可以使页眉和页脚正常工作

@media print{
    div.divFooter {
        position: fixed;
        bottom: 0;
    }
    div.divHeader {
        position: fixed;
        top: 0;
    }
    /* Fix overflow of headers and content */
    body {
        margin-top: 185px;
    }   
}

，但正文仅在第一页上起作用。对于其他所有页面，正文内容将继续并进入以下所有页面的标题中。我需要的是正文以一定的边距分页（例如，离页面底部50px），然后在一定的边距（例如距页面顶部185px）之后重新开始。在每个打印页面上都一样。

我尝试使用@page页边距，但是它们也会影响页眉和页脚，因此最终会遇到相同的问题。

内容始终是页眉，表和页脚。是否有任何可靠的方式可以按照我所描述的方式进行打印？

Answer 1

对于正在寻找此问题答案的任何人，我最终每隔x行数在html字符串服务器端手动生成分页符。

简而言之：

// this string inserts a page break in html
private const string PAGE_BREAK = "<p style=\"page-break-after: always;\">&nbsp;</p><p style=\"page-break-before: always;\">&nbsp;</p>";

if (lineCount % x == 0){
   htmlString.insert("</table>"); // close the table, otherwise the page break does nothing
   htmlString.insert(PAGE_BREAK);
   htmlString.insert("<table class='whatever-you-want-'>");
}

不太确切，但这就是要点。

浏览了无数文章，博客文章和堆栈溢出问题之后，看来我目前试图仅通过html和CSS无法实现的目标。如果有人知道，我将很高兴听到。

CSS标头-正文-页脚在单独的页面上打印

1 个答案: