Html2PDF表间距导出为pdf后的问题

Question

我正在使用这些选项将html导出为html2pdf的pdf。

html2pdf(document.getElementById('pm-pdf'), {
margin:       10,
filename:     'PM.pdf',
image:        { type: 'jpeg', quality: 0.98 },
html2canvas:  { scale: 2, logging: true, dpi: 192, letterRendering: true },
jsPDF:        { unit: 'mm', format: 'a3', orientation: 'portrait' }
});

，这是我的应用程序中的表视图。你可以看到它设计得很好。以pdf格式导出前

但是当我导出它为pdf时，它从顶部得到填充，正如你在图片中看到的。pdf格式导出后

解决方案我已经尝试过了。

1. 删除除'row'和'col'以外的所有类
2. 删除表格，并实现了简单的标签和添加边框它。
3. html2canvas。

*表代码

<table class="table table-bordered">
<tbody>
<tr class="prnt" *ngFor="let component of routineJobData.pmComponents[title]; let i=index">
<td>{{component.label}}:</td>
<td>{{component.value}}</td>
</tr>
</tbody>
</table>

Answer 1

面对同样的问题，原来是css的重置样式造成的。

改变:

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
display: block;
}

:

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
display: inline-block;
}

希望这能帮助到一些人。