Phantomjs page-break-after：总是创造空间
我面临phantomjs（HTML到PDF）的问题，我有1个HTML页面有16个div，我愿意在每个页面上添加分页符，但是当我添加页面中断后：总是在每个div然后在PDF中创造了很多的空间，假设当我添加2 div的空间和rest是与分页符然后空格是一点，但是当添加空间3,4,5等空间增加更多意味着每个页面有很多的空间，如何我可以解决这个，预先感谢。
这是我的代码
fs.readFile(__dirname + '/../pdf' + pdfpath, 'utf8', function (err, data) { // Render the page to variable. var html = ejs.render(data, pdfJSON); // Set this html as the content for the pdf file. page.set('content', html); var fileName = __dirname + '/pdfdata/' + f.formType + f.formId + '.pdf'; // Generate the pdf. page.render(fileName); }); 这是我的HTML页面代码
<html> <head> <title>PreQual PDF Export</title> <style type="text/css"> <!-- body { font-family: Arial; font-size: 33.0px } .pos { position: absolute; z-index: 0; left: 0px; top: 0px } .set-top{ top: 20px;} --> </style> </head> <body > <nobr> <nowrap> <div class="set-top" style="page-break-after: always;position:relative;left:50%;margin-left:-398px;width:928px;height:1170px;overflow:hidden"> <div style="position:absolute;left:0px;top:0px"> <img name="_1170:828" src="<%= baseUrl %>/pdf/prequal/page_001.jpg" height="1170" width="828" border="0" usemap="#Map"> </div> <div class="pos" id="_126:284" style="top:284;left:126"> <span id="_30.8" style=" font-family:Arial; font-size:30.8px; color:#fdfffd"> Prequal Documents for the</span> </div> <div class="pos" id="_126:323" style="top:323;left:126"> <span id="_30.8" style=" font-family:Arial; font-size:30.8px; color:#fdfffd"> procurement of Goods</span> </div> <div class="pos" id="_138:975" style="top:975;left:138"> <span id="_15.4" style="font-weight:bold; font-family:Arial; font-size: 14px; color:#fdfffd"> SAQ Return Date:<span><%= saqDate %></span></span> </div> <div class="pos" id="_492:975" style="top:975;left:492"> <span id="_15.4" style="font-weight:bold; font-family:Arial; font-size: 14px; color:#fdfffd"> Project Reference No. TCD<%= refNo %></span> </div> <div class="pos" id="_136:1092" style="top:1092;left:136"> <span id="_13.6" style="font-style:italic; font-family:Palatino Linotype; font-size:13.6px; color:#000000;"> <img name="_1170:829" src="<%= baseUrl %>/providers/public/files/<%= file1 %>" height="50" width="50" border="0" style="left:10px;" alt="No Image"/></span> </div> <div class="pos" id="_267:1095" style="top:1095;left:267"> <span id="_13.6" style="font-weight:bold;font-style:italic; font-family:Palatino Linotype; font-size:13.6px; color:#000000;"> <img name="_1170:829" src="<%= baseUrl %>/providers/public/files/<%= file2 %>" height="50" width="50" border="0" style="left:10px;" alt="No Image"/></span> </div> <div class="pos" id="_369:1095" style="top:1095;left:369"> <span id="_13.6" style="font-weight:bold;font-style:italic; font-family:Palatino Linotype; font-size:13.6px; color:#000000;"> <img name="_1170:829" src="<%= baseUrl %>/providers/public/files/<%= file3 %>" height="50" width="50" border="0" style="left:10px;" alt="No Image"/></span> </div> <div class="pos" id="_480:1093" style="top:1093;left:480"> <span id="_13.6" style="font-weight:bold;font-style:italic; font-family:Palatino Linotype; font-size:13.6px; color:#000000;"> <img name="_1170:829" src="<%= baseUrl %>/providers/public/files/<%= file4 %>" height="50" width="50" border="0" style="left:10px;" alt="No Image"/></span> </div> <div class="pos" id="_609:1094" style="top:1094;left:609"> <span id="_13.6" style="font-weight:bold;font-style:italic; font-family:Palatino Linotype; font-size:13.6px; color:#000000;"> </span> </div> </div> <!-- Page No 2 --> <div class="set-top" style="page-break-after: always;position:relative;left:50%;margin-left:-398px;width:928px;height:1170px;overflow:hidden"> <div class="pos" id="_0:0" style="top:0"> <img name="_1170:827" src="<%= baseUrl %>/pdf/prequal/page_002.jpg" height="1170" width="827" border="0" usemap="#Map"></div> <div class="pos" id="_157:1357" style="top:200;left:157"> <span id="_24.5" style=" font-family:Arial; font-size:24.5px; color:#61c5c5"> Contents</span> </div> <div class="pos" id="_414:1348" style="top:200;left:414"> <span id="_24.5" style=" font-family:Arial; font-size:24.5px; color:#fcfcfc"> Part 01</span> </div> <div class="pos" id="_414:1392" style="top:240;left:414"> <span id="_15.0" style="font-weight:bold; font-family:Arial; font-size:15.0px; color:#000000;"> INTRODUCTION</span> </div> <div class="pos" id="_154:1560" style="top:400;left:154"> <span id="_24.5" style=" font-family:Arial; font-size:24.5px; color:#fcfcfc"> Part 02</span> </div> <div class="pos" id="_414:1569" style="top:400;left:414"> <span id="_24.5" style=" font-family:Arial; font-size:24.5px; color:#fcfcfc"> Part 03</span> </div> <div class="pos" id="_154:1597" style="top:440;left:154"> <span id="_15.0" style="font-weight:bold; font-family:Arial; font-size:15.0px; color:#000000;"> PASS / FAIL</span> </div> <div class="pos" id="_154:1615" style="top:460;left:154"> <span id="_15.0" style="font-weight:bold; font-family:Arial; font-size:15.0px; color:#000000;"> REQUIREMENTS</span> </div> <div class="pos" id="_414:1607" style="top:440;left:414"> <span id="_15.0" style="font-weight:bold; font-family:Arial; font-size:15.0px; color:#000000;"> SELECTION CRITERIA</span> </div> </div></nowrap></nobr> </body> </html>
尝试这个
page.set( 'paperSize', { width: 1200, height: 1500} );