我正在使用基于Phantom JS的
https://www.npmjs.com/package/html-pdf库,它在内部使用webkit.我正在粘贴虚拟HTML& JS代码(将这些文件保存在1个文件夹中)并附加输出屏幕截图.
我面临的问题是在Windows上生成的PDF顶部有一些额外的空间(红色以上的空白区域),我无法摆脱它.
这是一个讨论类似问题的论坛(过时),https://groups.google.com/forum/#!topic/phantomjs/YQIyxLWhmr0.
input.html
<!DOCTYPE html>
<html lang="en">
<head>
<Meta charset="UTF-8">
</head>
<body>
<div id="pageHeader" style="border-style: solid;border-width: 2px;color:red;">
header <br/> header <br/> header <br/> header
</div>
<div id="pageContent" style="border-style: solid;border-width: 2px;color:green;">
<div>
body <br/> body <br/> body
</div>
</div>
JS
(你需要路径,fs,把手,html-pdf npm包)
var path = require('path');
var fs = require('fs');
var handlebars = require('handlebars');
var pdf = require('html-pdf');
saveHtml();
function saveHtml() {
fs.readFile('input.html','utf-8',{
flag: 'w'
},function(error,source) {
handlebars.registerHelper('custom_title',function(title) {
return title;
})
var template = handlebars.compile(source);
var data = {};
var html = template(data);
var options = {
'format': 'A4','base': "file://",/* You can give more options like height,width,border */
};
pdf.create(html,options).toFile('./output.pdf',function(err,res) {
if (err) {
console.log('err pdf');
return;
} else {
console.log('no err pdf');
return;
}
});
});
}
在ubuntu上输出
窗口输出
Windows中顶部的额外空间(红色上方的空白区域)是个问题.
那些没用的东西
1.添加
“边界”： {
“top”：“0px”//或mm,cm,in
}
到JS文件中的选项
https://www.npmjs.com/package/html-pdf#options
>给予固定的“身高”：“10.5in”& “width”：JS文件中的选项中的“8in”
>使利润率最高& padding-top到0px / -50px到pageHeader div.
>覆盖保证金顶部&在bootstrap.css中@media print中将主体填充为0px / -20px
>给头部固定高度
任何帮助将不胜感激.谢谢.
