有没有办法得到一个网页页眉/页脚打印在每一页？ [英] Is there a way to get a web page header/footer printed on every page?
问题描述
根据我的研究，似乎我想做的是不可能的，但如果有变化，我想检查看看是否有人想出了一个办法做这个。
Based on my research, it seems that what I want to do is not possible, but in case something has changed, I wanted to check to see if anyone had come up with a way to do this.
我有一个网络应用程序，根据浏览器窗口中的用户选择生成打印报告。我有一个自定义页眉和页脚，当报告从浏览器打印时，应该在每个打印页面上重复。它不是我需要的浏览器页眉和页脚，而是我生成的自定义。此外，我不认为这是CSS和媒体类型的问题，但我不是一个CSS专家。我没有问题获得页眉和页脚打印一次，但我不能让他们在每个页面上打印。我已经读过，也许如果我使用表格重新创建我的报告页面，然后使用表头标记和CSS，可能至少可以工作，以获得每个页面上的标题。我还没有成功，但我会再试一次，如果它是唯一的选择。一个同事建议我计数行在我的PHP，手动提出页眉和页脚根据需要。我想这是一个选项，但它似乎应该有一种方法来做这不是那么暴力！
I have a web app that generates reports for print based on user selections in the browser window. I have a custom header and footer that, when the report is printed from the browser, should be repeated on every printed page. It is not the browser header and footer I need, but rather the custom ones that I generate. Also, I don't think this is an issue of CSS and media types, but I am not a CSS expert. I have no issues getting the header and footer to print once, but I can't get them to print on each page. I have read that perhaps if I recreated my report pages using tables, and then used table head tags and CSS, that may work at least to get the header on each page. I have not had success with this yet, but I will try it again if it is the only option. A coworker suggested that I count lines in my php and manually put out the header and footer as required. I guess that is an option, but it just seems like there should be a way to do this that isn't so "brute force"!
另一个警告是，我必须支持IE 6，所以我怀疑一些CSS的东西，我试过只是不支持。
The other caveat is that I have to support IE 6, so I suspect some of the CSS things I have tried are just not supported.
如果有人知道任何方式做到这一点，大！
If anyone knows any way to do this, that would be great! If there isn't, I will have to rethink my approach.
提前感谢！
UPDATE（14 Dec 2011）
我在这个问题上取得了相当大的进展，并使用了答案中的一些信息，可用，但从来没有像我想要的那么好或专业。页脚往往不够靠近页面底部，我不得不做很多猜测工作和脆弱计算，关于如何大文本将是决定插入分页符，我只能支持一个限制一组页面格式，对报告的任何更改都导致了代码更改的级联，但更加脆弱的计算。总是有一个场景打破了一些报告的一部分。我们已恢复要求，现在正在使用TCPDF 生成PDF格式的报告。文档有点不透明，需要一些实验，但结果是远远优越的，现在报告出现他们应该。我会对任何人尝试从浏览器做HTML报告，除非他们很简单，保存自己的挫折（像其他人告诉我在这里），并去PDF或类似的东西。
I made considerable progress with this issue, and using some of the info from the answers, I did produce reports that were usable, but never as nice or as professional as I wanted. Footers would tend to be not close enough to the bottom of the page, I had to do a lot of guess work and "brittle" calculations about how big text was going to be to decide on inserting page breaks, I could only support a restricted set of page formats, and any changes to the reports resulted in a cascade of code changes and yet more brittle calculations. There was always a scenario that broke some part of some report. We revisted the requirements, and are now generating reports as PDFs using TCPDF. The documentation is a bit opaque, and it takes some experimentation, but the results are far superior and now the reports appear as they should. I would say to anyone trying to do HTML reports from the browser, unless they are very simple, save yourself the frustration (as others told me here) and go with PDFs or something similar.
推荐答案
可以通过表来做 - 我知道我会冒险通过建议使用表格布局 - 但我们在这里说IE6这是不是以其出色的CSS支持而着称： - ）
It can be done with tables -- and I know I'm going to risk a downvote by suggesting using tables for layout - but we are talking IE6 here which isn't known for its fantastic CSS support :-)
如果您按如下所示设置CSS样式：
If you set a CSS style as follows:
thead { display: table-header-group; }
tfoot { display: table-footer-group; }
然后当你创建你的HTML时，渲染你的身体：
Then when you create your HTML, render your body as:
<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>
是的不好（表vs CSS），这不是理想的，在IE6上工作。我不能评论Firefox，因为我没有测试它，但它应该做的工作。这也将处理不同大小的页面，不同的字体大小等，所以它应该只工作。
Yes it's not good (tables vs CSS), it's not ideal, but (importantly for you) it does work on IE6. I can't comment on Firefox as I've not tested it there, but it should do the job. This will also handle differnt sized pages, differing font sizes, etc. so it should "just work".
如果您希望页眉和页脚只出现在印刷媒体，然后使用@media参数做正确的事情：
If you want the header and footer to appear on printed media only, then use the @media parameters to do the right thing:
@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）在问题跟踪器中存在长期存在的错误，如果任何人对它们投票的感觉足够强烈：
Note
As of July 2015, this will still only work in Firefox and IE. Webkit-based browsers (cf. Chrome, Safari) have long standing bugs in their issue trackers about this if anyone feels strongly enough to vote on them:
- https://bugs.webkit.org/show_bug.cgi?id=17205
- https ：//code.google.com/p/chromium/issues/detail？id = 24826
- https://code.google.com/p/chromium/issues/detail?id=99124
- https://bugs.webkit.org/show_bug.cgi?id=17205
- https://code.google.com/p/chromium/issues/detail?id=24826
- https://code.google.com/p/chromium/issues/detail?id=99124
这篇关于有没有办法得到一个网页页眉/页脚打印在每一页？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
