我通过wkhtmltopdf输出一些html，并使用自定义的页眉和页脚。
标题html如下：
<!doctype html>
<html>
<head>
<style>
body {
font-size: 12px;
margin: 0;
padding: 0;
}
.page-header {
background: #2A5266 -webkit-linear-gradient(
left,
#cbd5da 0,
#cbd5da 50pt,
white 50pt,
white 75pt,
#cbd5da 75pt,
#cbd5da 100pt,
white 100pt,
white 125pt,
#2A5266 125pt,
#2A5266
);
height: 72pt;
border: none;
margin: 0;
padding: 0;
width: 100%;
position: relative;
display: block;
}
</style>
</head>
<body>
<div class="page-header">
</div>
</body>
</html>
页脚html是：
<!doctype html>
<html>
<head>
<style>
body {
font-size: 12px;
margin: 0;
padding: 0;
}
.page-footer {
background: #2A5266 -webkit-linear-gradient(
left,
#cbd5da 0,
#cbd5da 50pt,
white 50pt,
white 75pt,
#cbd5da 75pt,
#cbd5da 100pt,
white 100pt,
white 125pt,
#2A5266 125pt,
#2A5266
);
height: 26pt;
border: none;
margin: 0;
padding: 0;
width: 100%;
position: relative;
display: block;
}
</style>
</head>
<body>
<div class="page-footer"></div>
</body>
</html>
我正在使用的命令如下：
wkhtmltopdf -L 0cm -R 0cm -T 2.75cm -B 0.7cm -O landscape --footer-html http://foo.com/footer --header-html http://foo.com/header --header-spacing 5 http://foo.com/html output.pdf
一切都可以100％正确地工作，但是标头没有使用线性渐变。它几乎就像线性渐变一样，被完全忽略了，因为标头只是纯深蓝色。如您所见，页眉和页脚的html几乎完全相同，因此它不适用于页脚而不是页眉是没有意义的。
如果我更改标题上的
position:absolute，则会出现标题渐变，但这会导致太多其他问题。 最佳答案
最后，我为每个td元素使用了一个具有明确宽度设置的表格，并且效果很好。
关于html - Wkhtmltopdf输出不一致，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/47331768/