html2pdf 错误的页面大小和缺少 css答案

【问题标题】：html2pdf wrong page size and missing csshtml2pdf 错误的页面大小和缺少 css
【发布时间】：2018-03-09 20:40:54
【问题描述】：

我正在使用 html2pdf (https://github.com/eKoopmans/html2pdf) 将表单转换为 pdf onclick。表单本身就很复杂，包括css/js/html 4页。我现在只是想捕捉其中的一页。

该插件可以满足我的要求，但页面大小错误并且缺少一些 css。在线表格的末尾如下所示： End of page 1

生成的 pdf 的结尾如下所示： End of page 1 pdf

左边距和上边距正常，右边距和下边距不合适，整个文本在 pdf 上有点太大。也许像使整个图像尺寸更小的代码之类的代码将有助于将所有内容重新放在一页上，因为原始文本也具有较小的文本。同样如您所见，文本周围的蓝框不见了。我猜那是css。

我的代码如下所示：

<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>

【问题讨论】：

标签： javascript html css html2pdf

【解决方案1】：

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

【讨论】：

overflow: 'linebreak'，在集成到脚本中时不起作用，没有任何反应或脚本完全停止工作。
建议然后调整整个正文或任何整个表单的大小，以便它适合您的一页或使 pdf 的大小更大。
您可以使用此doc.internal.pageSize.height; 这将获取 PDF 的高度，您可以根据高度放置元素。例如使用类似 doc.internal.pageSize.height - 30 的方式设置元素的高度
我尝试在“函数打印到 pdf”下面将其集成为“var height = document.internal.pageSize.height -30”，但它会阻止脚本工作。也许我只是把代码放错了，我是 js 新手
你不能只设置var height 并期望它工作，你还需要将它应用到css。并且不要只是说它不起作用，提供错误消息。现在您需要了解如何使用 js 更改元素高度。