javascript - 将 HTML/CSS 传单导出为图像或 pdf 以进行打印

Question

我正在为遛狗者创建一个基于 Web 的传单设计器，以自定义要打印的传单。这是非常基本的，并使用 jQuery 将 DIV 的内容/文本更改为他们在传单上想要的内容......

我的问题是如何让他们打印传单。理想情况下，他们希望在每个 A4 页面上选择 2 个或 4 个传单。或导出为 pdf 或图像以带到打印机。我已经研究过将 html/css 导出为 PDF 或图像，但似乎找不到任何适合这种情况的东西。

任何帮助表示赞赏。

谢谢

score 3 · Accepted Answer

3

Webkit HTML to PDF\Image 应该完全符合您的要求：

于 2012-04-30T13:18:31.107 回答

score 2 · Accepted Answer

我建议print在主样式表中使用媒体类型：

@media print
{
  /* style sheet for print goes here */
}

或者，在它自己的样式表中分离打印样式：

<link href="foo.css" media="print" rel="stylesheet" type="text/css" />

这允许您定义在使用浏览器的打印对话框（文件->打印...）时显示的自定义样式。这样，您的最终用户可以打印到他们的打印机、打印到 PDF（或 Microsoft XPS 文档编写器）或他们想要打印到的任何其他内容，而无需依赖根据过去的经验受制于的第三方库转换 CSS 样式时的怪癖和不准确之处。

score 0 · Accepted Answer

您有很多选择......这只是一个，以防您想在不做太多工作的情况下将网页导出为 PDF：

score 0 · Accepted Answer

只是为了更多的选择，还有 phantomJS，它也使用 webkit 渲染引擎。QtPDF 是它在幕后使用的 pdf 引擎

这假设您有一个可以执行命令行脚本的服务器。我最近在一个项目中使用了它，它非常适合转换 HTML->PNG。没有对 PDF 功能进行广泛的亲自测试。

4 回答 4