Python Weasyprint和CSS：页眉、页脚、分页符和定位
我正在用html构建一个发票报告模板，并使用Weasyprint将其生成为PDF（最终生成为docx） 我面临的问题是，不仅无法分页符，而且无法正确生成运行的页眉和页脚，而不会使正文内容重叠，也无法将我的数据转换为zalgo文本 我的报告模板具有以下简单格式：Python Weasyprint和CSS：页眉、页脚、分页符和定位,python,html,css,templates,weasyprint,Python,Html,Css,Templates,Weasyprint,我正在用html构建一个发票报告模板，并使用Weasyprint将其生成为PDF（最终生成为docx） 我面临的问题是，不仅无法分页符，而且无法正确生成运行的页眉和页脚，而不会使正文内容重叠，也无法将我的数据转换为zalgo文本 我的报告模板具有以下简单格式： +==========================+ + Header + +==========================+ + Body + +=
+==========================+
+ Header +
+==========================+
+ Body +
+==========================+
+ Footer +
+==========================+
include<!DOCTYPE html>
<html>
<head>
<style type="text/css" media="all">
@page {
size: A4 portrait; /* can use also 'landscape' for orientation */
margin: 1cm;
@top-left{
content: element(header);
}
@bottom-left{
content: element(footer);
}
}
header, footer, .body_content{
font-size: 12px;
/* color: #000; */
font-family: Arial;
width: 100%;
position: relative;
}
header {
/*position: fixed;*/
/*position: running(header); */
/*display: block; */
}
footer {
position: fixed;
/*position: running(footer);*/
/*position: absolute;*/
bottom: 0;
/*display: block;*/
}
.body_content {
position: relative;
page-break-inside: auto;
height: 320pt;
/*overflow: hidden;*/
}
</style>
</head>
<body>
<header>
{% include 'sampleTemplate_header.html' %}
</header>
<div >
<table class="body_content">
<tbody >
<tr style="padding-top:5px;" >
<td style="width:60%;" >
</td>
<td style="width:10%;" >
</td>
<td style="width:15%;" >
</td>
<td style="width:15%;" >
</td>
</tr>
<tr>
</tr>
<tr >
<td style="width:60%;" >
</td>
<td style="width:10%;" >
</td>
<td style="width:15%;" align="right" >
</td>
<td style="width:15%;" align="center" >
</td>
</tr>
<tr >
<td style="width:60%;" id="testCell" >
</td>
<td style="width:10%;" >
</td>
<td style="width:15%;" >
</td>
<td style="width:15%;" >
</td>
</tr>
</tbody>
</table>
</div>
<footer>
{% include 'sampleTemplate_footer.html' %}
</footer>
</body>
</html>
@页面{
尺寸：A4纵向；/*也可以使用“横向”进行定向*/
边缘：1cm；
@左上角{
内容：元素（标题）；
}
@左下角{
内容：元素（页脚）；
}
}
页眉、页脚、.body\u内容{
字体大小：12px；
/*颜色：#000*/
字体系列：Arial；
宽度：100%；
位置：相对位置；
}
标题{
/*位置：固定*/
/*位置：运行（收割台）*/
/*显示：块*/
}
页脚{
位置：固定；
/*位置：运行（页脚）*/
/*位置：绝对位置*/
底部：0；
/*显示：块*/
}
.正文内容{
位置：相对位置；
内部分页符：自动；
高度：320磅；
/*溢出：隐藏*/
}
{%include'sampleTemplate_header.html%}
{%include'sampleTemplate\u footer.html%}
我最普遍的问题之一是正文内容与页眉或页脚重叠。后来的情况甚至发生了，尽管在之后出现了强制的
分页符，我还是让它与正在运行的元素一起工作（我在这里读到了：）
如果你把页脚放在主要内容之前，那么它将显示在每一页上。运行元素显然会将一个元素从主流移动到页边距中，因此我猜如果它不在页面中，它就不能将其移动到页边距中
为了使页眉/页脚不再与内容重叠，我必须使用@页面的边距值。由于运行元素会将元素移动到边距中，因此边距越大，其空间就越大。在下面的示例中，如果减小“上（或下）页边距”的值，页眉（或页脚）将重叠
有时我必须设置页眉/页脚高度
值，以使其正确定位在页边空白处，但在本例中我不必这样做
<!DOCTYPE html>
<html>
<head>
<style type="text/css" media="all">
@page {
size: A4 portrait; /* can use also 'landscape' for orientation */
margin: 100px 1cm 150px 1cm;
@top-left{
content: element(header);
}
@bottom-left{
content: element(footer);
}
}
header {
position: running(header);
/*height: 100px;*/
}
footer {
position: running(footer);
/*height: 150px;*/
}
</style>
</head>
<body>
<header>
multiline<br>header<br>lots<br>of<br>lines<br>here<br>
</header>
<footer>
multiline<br>footer<br>lots<br>of<br>lines<br>here
</footer>
<div >
stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff<br>stuff
</div>
</body>
</html>
@页面{
尺寸：A4纵向；/*也可以使用“横向”进行定向*/
余量：100px1cm 150px1cm；
@左上角{
内容：元素（标题）；
}
@左下角{
内容：元素（页脚）；
}
}
标题{
位置：运行（收割台）；
/*高度：100px*/
}
页脚{
位置：运行（页脚）；
/*高度：150像素*/
}
多行
标题
大量
行
此处
多行
页脚
此处有大量
行
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
r> stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuff
stuffff
东西
东西