将 HTML 页面转换为 PDF

Question

从概念上讲，这很简单。

我有一个 HTML 页面。我想要它的 PDF 格式。我打开 Foxit 的 PhantomPDF 并转换文件。

问题：

1. 它太宽了，它的边被削掉了（主要是右边）
2. 它不知道它在读什么，所以我有分页符，实际上是将单词水平切成两半。

如何将 HTML 页面成功转换为 PDF 并避免这些问题？

谢谢。

Answer 1

所以这个问题的答案最终是几件事的结合。

1) 我必须编辑 CSS 以确保图像实际上位于页面“100%”的范围内。我添加了 CSS 以确保所有图像都达到 90%。这防止了页面上的任何左右滚动，并防止了 PDF 中的任何内容被截断。

2) 我进入浏览器中文件菜单的页面设置部分，转到 "Margins and Footers" 选项卡，那里有一些地方写着 date/url/page 数字之类的东西。我把所有这些都删掉了，一切都很好。

3) 最棘手的部分是确保它在正确的位置拆分页面。我终于了解了名为 page-break-before 和 page-break-inside 的 CSS 属性。我用这些集合创建了 类，如下所示：

// Creates a page break in the PDF right before element with this class
.pagebreak{
    page-break-before: always;    
}

// Doesn't allow the contents of a div with this class to split across pages.
.nobreak{
    page-break-inside: avoid;    
}

并且，当转换为 PDF 时，它会读取这些内容并按照我的需要布置页面。这有点乏味，但我最终得到了我想要的确切 PDF！