本文介绍了使用css在打印模式下每页的页眉和页脚的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个Web应用程序,它的报告可能超过一页,我想在每页中打印一个页眉和页脚.我发现并尝试这样做:在每个页面中重复报告标题但这对我不起作用.我尝试用Opera,IE9,Firefox,Google Chrome浏览器,但是……什么都没有.
I have a web application and it has a report that might exceed one page and I would like to print a header and footer in every page.i find and try this:Repeating a report header in each pagebut it didn't work for me.I try opera,IE9,Firefox,Google Chrome but ... nothing.page-margin works fine but content is what I want and it doesn't work.
推荐答案
您可以设置position: fixed;
页眉和页脚,以便在每个页面上重复显示
You can set a position: fixed;
header and footers so that it will repeat on each page
例如
<header class="onlyprint"><!--Content Goes Here--></header>
<footer class="onlyprint"><!--Content Goes Here--></footer>
@media screen {
header.onlyprint, footer.onlyprint{
display: none; /* Hide from screen */
}
}
@media print {
header.onlyprint {
position: fixed; /* Display only on print page (each) */
top: 0; /* Because it's header */
}
footer.onlyprint {
position: fixed;
bottom: 0; /* Because it's footer */
}
}
这篇关于使用css在打印模式下每页的页眉和页脚的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!