html2pdf错误的页面大小和缺少的CSS

Question

Im using html2pdf ( https://github.com/eKoopmans/html2pdf ) to convert a form to pdf onclick. The form itself is very complex and includes 4 pages of css/js/html. Im just trying to capture one page of that now.

The plugin does what i want, but the page size is wrong and some css is missing. Online the end of the form looks like: End of page 1

The end of the generated pdf looks like this: End of page 1 pdf

The left and top margin is ok, right and bottom are not fitting and the whole text is a little too big on pdf. Maybe sth like a code to make the whole image size smaller would help to get all back on one page, since the original also has smaller text. Also as you can see, the blue frames around the text are missing. I guess thats css.

My code looks like this:

 <script type="text/javascript" src="https://rawgit.com/eKoopmans/html2pdf/master/dist/html2pdf.bundle.min.js"></script> <script> function printPDF() { var element = document.getElementById('element-to-print'); html2pdf(element, { hmargin: -0.60, vmargin: 20, filename: 'myfile.pdf', image: { type: 'jpeg', quality: 0.98 }, html2canvas: { dpi: 192, letterRendering: true }, jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait'} }); } </script> 

Answer 1

我认为您需要将此样式包括在某处， overflow: 'linebreak',如果您处理表格，我也建议使用jspdf autotable