【发布时间】：2021-12-30 06:15:17
【问题描述】：
我们使用 WeasyPrint 版本：53.4 和 Python 版本：3.9.1 从 html 模板生成 PDF。但是我们在第一页之后的运行标题对齐中遇到了问题。它与issue 完全相同，并且该问题的解决方案对我们不起作用。 我将在这里更新示例代码：
Python：
from weasyprint import HTML, CSS
def new_test(request):
pdf_file = HTML("invoice.html").write_pdf(stylesheets=[CSS("invoice.css")])
response = HttpResponse(pdf_file,content_type="application/pdf")
response["Content-Disposition"] = "attachment;filename=print_final.pdf"
return response
HTML 和 CSS：
body {
margin-top: 4.5cm;
border: 0.1cm solid red;
font-family: Arial, Helvetica, sans-serif;
height: 20cm;
width: 100%;
}
header {
position: running(header);
border: 0.1cm solid black;
height: 5cm;
width: 17cm;
display: flex;
flex-direction: row;
justify-content: space-between;
margin-top: 5cm;
padding-top: 0cm;
}
.header_text {
text-align: right;
padding-right: 0;
/* position: fixed; */
width: 100%;
}
footer {
position: running(footer);
border: 0.1cm solid blue;
height: 1cm;
}
@page {
@top-center {
content: element(header);
width: 100%;
}
@bottom-center {
content: element(footer);
width: 100%;
}
size: A4;
}<html>
<head>
<meta charset="utf-8" />
<link href="invoice.css" media="print" rel="stylesheet" />
<title>Invoice</title>
<meta name="description" content="Invoice demo sample" />
</head>
<header id="header" class="header">
<div class="header_text">
<p>Company logo</p>
<p>Company XYZ - NewCity</p>
<p>Address - Contact Details</p>
<p>Webbsite Info</p>
<p>Phone Number</p>
</div>
</header>
<body>
<h3>Table 1</h3>
<table>
<thead>
<tr>
<th>Description</th>
<th>Price</th>
<th>Quantity</th>
<th>Subtotal</th>
</tr>
</thead>
<tbody>
<tr>
<td>Website design</td>
<td>€34.20</td>
<td>100</td>
<td>€3,420.00</td>
</tr>
<tr>
<td>Website development</td>
<td>€45.50</td>
<td>100</td>
<td>€4,550.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
</tbody>
</table>
<h3>Table 2</h3>
<table>
<thead>
<tr>
<th>Description</th>
<th>Price</th>
<th>Quantity</th>
<th>Subtotal</th>
</tr>
</thead>
<tbody>
<tr>
<td>Website design</td>
<td>€34.20</td>
<td>100</td>
<td>€3,420.00</td>
</tr>
<tr>
<td>Website development</td>
<td>€45.50</td>
<td>100</td>
<td>€4,550.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
</tbody>
</table>
<h3>Table 3</h3>
<table>
<thead>
<tr>
<th>Description</th>
<th>Price</th>
<th>Quantity</th>
<th>Subtotal</th>
</tr>
</thead>
<tbody>
<tr>
<td>Website design</td>
<td>€34.20</td>
<td>100</td>
<td>€3,420.00</td>
</tr>
<tr>
<td>Website development</td>
<td>€45.50</td>
<td>100</td>
<td>€4,550.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
</tbody>
</table>
<h3>Table 4</h3>
<table>
<thead>
<tr>
<th>Description</th>
<th>Price</th>
<th>Quantity</th>
<th>Subtotal</th>
</tr>
</thead>
<tbody>
<tr>
<td>Website design</td>
<td>€34.20</td>
<td>100</td>
<td>€3,420.00</td>
</tr>
<tr>
<td>Website development</td>
<td>€45.50</td>
<td>100</td>
<td>€4,550.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
<tr>
<td>Website integration</td>
<td>€25.75</td>
<td>100</td>
<td>€2,575.00</td>
</tr>
</tbody>
</table>
</body>
<footer>This is a footer test</footer>
</html>在第一页中，我们将页眉放在了正确的位置，但之后却不如预期。我们尝试更新第二页的 CSS 等等，但没有成功。
谢谢！
【问题讨论】：
标签： html css pdf-generation weasyprint django-weasyprint