How to add padding after page break using html2pdf

半腔热情 提交于 2020-03-25 19:01:28

问题


Converting vue.js html to pdf using html2pdf. Here everything is fine, Only thing i need to add padding-top and padding-bottom after pagebreak elements.

Here is code that I tried.

var element = document.getElementById('inner');
            var opt = {
                margin: 0,
                filename: this.auth_user,
                image: {type: 'jpeg',quality: 0.98},
                html2canvas: {
                    scale: 2,
                    bottom: 20
                },
                pagebreak: { mode: ['css']},
                jsPDF: {
                    unit: 'mm',
                    orientation: 'portrait'
                }
            };

            html2pdf().set(opt).from(element).then(function() {
                $("#inner").css( { "font-size":"12px", "background-color" : "#F5F5F5" });
            }).save();

And here need padding

Here is the sample

It will save my day


回答1:


The only way to fill it out is through CSS, but you can define a margin for your document like this:

var opt = {
               margin:       [30, 0, 30, 0], //top, left, buttom, right
                filename: this.auth_user,
                image: {type: 'jpeg',quality: 0.98},
                html2canvas: {
                    scale: 2,
                    bottom: 20
                },
                pagebreak: { mode: ['css']},
                jsPDF: {
                    unit: 'mm',
                    orientation: 'portrait'
                }
              };

Fiddle example



来源:https://stackoverflow.com/questions/57752081/how-to-add-padding-after-page-break-using-html2pdf

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!