[英]CSS / html-pdf issue: Overflow of page
I have the following very simple HTML.我有以下非常简单的 HTML。
<html>
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
<h1>Test</h1>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. </p>
</div>
</div>
</div>
</body>
</html>
Using html-pdf
, I want to produce an A4 PDF file out of the HTML.使用
html-pdf
,我想从 HTML 中生成一个 A4 PDF 文件。
let data;
var fs = require('fs');
var pdf = require('html-pdf');
var html = fs.readFileSync('test.html', 'utf8');
var options = { format: 'A4' };
pdf.create(html, options).toFile('test.pdf', function(err, res) {
if (err) return console.log(err);
console.log(res);
});
As a result I get a PDF file but it looks like the HTML is cut off.结果,我得到了一个 PDF 文件,但看起来 HTML 被切断了。
How can I solve it?我该如何解决?
You could try container-fluid
instead of container
.您可以尝试
container-fluid
而不是container
。
container-fluid
takes up the full width of the viewport and is flexible. container-fluid
占据了视口的整个宽度并且是灵活的。
container
on the other hand takes width with respect to the different breakpoints and is fixed in width for different screen sizes.另一方面,
container
相对于不同的断点采用宽度,并且对于不同的屏幕尺寸其宽度是固定的。
In html code instead of在 html 代码中,而不是
<div class="col-md-12">
try尝试
<div class="col-12">
I have tried col-12 in my few web projects, it takes all the width of the parent tag(row wise).我在我的几个 web 项目中尝试了 col-12,它占用了父标签的所有宽度(按行)。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.