39

根据我的研究，似乎我想做的事情是不可能的，但万一发生了变化，我想看看是否有人想出了一个办法来做到这一点。

我有一个 Web 应用程序，它根据浏览器窗口中的用户选择生成打印报告。我有一个自定义页眉和页脚，当从浏览器打印报告时，应该在每个打印页面上重复。这不是我需要的浏览器页眉和页脚，而是我生成的自定义页眉和页脚。另外，我不认为这是 CSS 和媒体类型的问题，但我不是 CSS 专家。我没有问题让页眉和页脚打印一次，但我不能让它们在每一页上打印。我已经读过，也许如果我使用表格重新创建报告页面，然后使用表格标题标签和 CSS，那么至少可以在每个页面上获取标题。我还没有成功，但如果这是唯一的选择，我会再试一次。一位同事建议我在我的 php 中计算行数并根据需要手动放置页眉和页脚。我想这是一个选择，但似乎应该有一种方法可以做到这一点，而不是那么“蛮力”！

另一个警告是我必须支持 IE 6，所以我怀疑我尝试过的一些 CSS 东西不被支持。

如果有人知道任何方法可以做到这一点，那就太好了！如果没有，我将不得不重新考虑我的方法。

提前致谢！

更新（2011 年 12 月 14 日）

我在这个问题上取得了相当大的进展，并使用答案中的一些信息，我确实生成了可用的报告，但从来没有像我想要的那样好或专业。页脚往往离页面底部不够近，我不得不做很多猜测工作和“脆弱”计算来决定插入分页符的文本大小，我只能支持一个受限的一组页面格式，以及对报告的任何更改都会导致一连串的代码更改和更脆弱的计算。总有一种情况会破坏某些报告的某些部分。我们修改了要求，现在使用 TCPDF 生成 PDF 格式的报告. 文档有点不透明，需要进行一些实验，但结果要好得多，现在报告显示为应有的样子。我会对任何试图从浏览器进行 HTML 报告的人说，除非它们非常简单，否则不要让自己感到沮丧（正如其他人在这里告诉我的那样）并使用 PDF 或类似的东西。

4

4 回答 4

34

它可以用表格来完成——我知道我会冒着被否决的风险建议使用表格进行布局——但我们在这里谈论的是 IE6，它并不以其出色的 CSS 支持而闻名:-)

如果你设置一个 CSS 样式如下：

thead { display: table-header-group; }
tfoot { display: table-footer-group; }

然后，当您创建 HTML 时，将您的正文呈现为：

<body>
<table>
   <thead><tr><td>Your header goes here</td></tr></thead>
   <tfoot><tr><td>Your footer goes here</td></tr></tfoot>
   <tbody>
     <tr><td>
     Page body in here -- as long as it needs to be
     </td></tr>
   </tbody>
</table>
</body>

是的，它不好（表格与 CSS），它并不理想，但（对你来说很重要）它确实适用于 IE6。我无法对 Firefox 发表评论，因为我没有在那里测试过，但它应该可以完成这项工作。这也将处理不同大小的页面、不同的字体大小等，因此它应该“正常工作”。

如果您希望页眉和页脚仅出现在印刷媒体上，请使用 @media 参数做正确的事情：

@media print {
    thead { display: table-header-group; }
    tfoot { display: table-footer-group; }
}
@media screen {
    thead { display: none; }
    tfoot { display: none; }
}

注意
截至 2015 年 7 月，这仍然只适用于 Firefox 和 IE。基于 Webkit 的浏览器（参见 Chrome、Safari）在其问题跟踪器中存在长期存在的错误，如果有人强烈认为可以对它们进行投票：

这个问题下面的评论告诉我，现在 Chrome 已经解决了这个问题。我还没有检查过自己:-)

针对 Chrome 的原始错误（供参考）是：

于 2009-11-12T15:32:54.120 回答
6

这将适用于某些浏览器，而不是全部。我认为没有优雅的跨浏览器解决方案

在页面上的 div 中包含所需的打印页脚/页眉（在此示例中 div id='printableFooter'）

在屏幕css文件中放置：

#printableFooter {display: none;}

在打印 css 文件中：

#printableFooter {display: block; position: fixed; bottom: 0;}
于 2009-11-12T14:17:03.480 回答
5

我建议在表格中划分页面，并将页眉部分添加到第一行，将页脚部分添加到最后一行。第一行和最后一行之间的行内容可以动态更改，因此您将在所需页面处获得恒定的页眉和页脚。

----------
ROW1    HEADER
----------
ROW2   
 Insert dynamic contents here
ROW N-1
----------
ROW N Footer
于 2009-11-12T14:20:11.553 回答
3

尝试生成 (rtf | pdf) 文档进行打印

于 2009-11-12T15:17:02.780 回答