我有三个单独的部分作为标题,正文和页脚来创建pdf.
______________________ | header | |______________________|
______________________ | | | | | body | | | | | |______________________|
______________________ | footer | |______________________|
所以如果内容很大,如果创建了两个页面,那么我应该得到两个页面：
______________________ | header | |______________________| | | | | | Body Part1 | | | | | |______________________| | footer | |______________________|
和
______________________ | header | |______________________| | | | | | Body part2 | | | | | |______________________| | footer | |______________________|
我试着用table format,它正在为标题和内容,但不是为页脚工作.页脚仅在第二页的底部而不是第一页.
我正在使用laravel dompdf
任何帮助将赞赏.
解决方法
HTML假定一个不间断的不间断的元素序列,而打印的页面需要将该内容分割成多个部分.如果没有告诉它,则最好的解释器是将元素分离到页面上,以便它们大部分适合单个页面.
This very exhaustive article on SmashingMagazine会告诉你很多关于如何使用CSS设计HTML进行打印.
最重要的是对于你的问题,它会详细说明@page区域on a tidy sheet.相关的你可能会是顶级中心和底层中心的地区(不像你可能认为看到文件,可能会很好地延伸到整个宽度文件).
使用这些区域,您可以通过CSS定义页眉和页脚,如果您正在设计一本书,甚至可以根据它们的折叠边来对其进行风格化.这些工作通过直接在CSS中添加内容,因此您的HTML不需要任何标记.
/* print a centered title on every page */
@top-center {
content: "Title";
color: #333;
text-align: center;
}
/* print the title on the left side for left-hand pages,and vice versa */
@page:left {
@top-left {
content: "Title";
color: #333;
}
}
@page:right {
@top-right {
content: "Title";
color: #333;
}
}
虽然你使用laravel是一个非问题,但是我没有浏览器会打印这些区域,所以对于常规的打印样式表来说,这不是一个实用的方法.
虽然您可以使用CSS做很多工作,但您可能会发现这些内容过于复杂,无法以上述方式创建.在这种情况下,您可以使用具有position：fixed属性的元素,它将渲染在每个页面的顶部/底部,具体取决于您的风格,例如：
@media print {
header {
position: fixed;
top: 0;
}
footer {
position: fixed;
bottom: 0;
}
}
HTML：
<body>
<header>
above the content on screen,and on the top of every printed page
</header>
<main>
content that is flowing and behaving as you would expect it
</main>
<footer>
below the content on screen,and on the bottom of every printed page
</footer>
</body>
