为基于WebKit的浏览器进行打印分页HTML文档 [英] Paginating HTML document for printing with WebKit-based browsers

问题描述

Internet Explorer具有打印模板引擎，我可以使用 DEVICERECT 元素来表示物理页面，然后使用 LAYOUTRECT 元素作为矩形视图来将HTML文档流入页面并驱动分页。这样可以防止相邻页面中间的线段被切断。此机制在此处详细介绍。

WebKit是否提供了类似的功能？具体来说，PhantomJS有吗？我正在寻找任何可以对现有的HTML文档进行分页的方法，该文档没有预定义的分页符，并将其分页为新的转换后的HTML或PDF文档，而不会在中间截断行。

解决方案

浏览器引擎应该处理所有事情，您可以使用样式表为 media =print 。

例如，要强制分页符，以便每个级别1或2的标题（< h1> / code>或< h2> ）放置在新页面的开始位置，使用 page-break-before ：

b
$ b

  h1，h2 {page-break-before：always; } 
  

在Chrome中，IE& Opera可以控制 widows 和 orphans ，但它尚未登陆WebKit，所以现在你可以使用 p>

  p {page-break-inside：avoid; } 
  

避免分段内的分页符。

您甚至可以控制页边距，以便第一页，左侧页和右侧页 render（）使用样式表作为打印介质。 rasterize.js 示例看起来就像是一个随时可用的打印解决方案。

Internet Explorer has Print Template engine, where I can use DEVICERECT element to represent a physical page, then use LAYOUTRECT element as a rectangular view to flow the HTML document through into the page and drive the pagination. That prevents lines from being cut-off in the middle between adjacent pages. This mechanism is described in details here.

Does WebKit provide a similar feature? Specifically, does PhantomJS do? I'm looking for anything that would allow to paginate an existing HTML document which doesn't have predefined page-breaks, and view it paginated as a new transformed HTML or PDF document, without lines being cut-off in middle.

解决方案

The browser engine should take care of everything and you can aid it using a stylesheet for media="print".

For example to force page breaks such that every heading of level 1 or 2 (<h1> or <h2>) is placed at the beginning of a new page use page-break-before:

h1, h2 { page-break-before:always; }

In Chrome, IE & Opera you can control widows and orphans, but it hasn't landed in WebKit yet, so for now you could use

p { page-break-inside: avoid;  } 

to avoid page breaks inside paragraphs.

You can even control margins for first, left and right pages separately.

Phantom's render() uses stylesheets for print media if the output is a pdf file. rasterize.js example looks like a ready to use printing solution.

这篇关于为基于WebKit的浏览器进行打印分页HTML文档的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！