Question

我有一个页面，一个接一个地有divs，由一个循环生成，都有相同的类，所有divs都包含图像和文本。我需要将此页面设置为打印样式。我遵循了有关尺寸，颜色，边距等的所有基本原则。

但是，我不希望这些框在打印时在页面之间分开，就像当一个框开始在页面末尾附近并且打印了一些文本而其余部分在下一页上时。当页面上div的总高度超过page-break-before:always

时，我使用javascript插入分页符div（样式为800 (assumed value).）

然而，当我打印时，文本大小会发生变化，div会变得更长/更短，并且分页符错位。

我正在做answer here所说的同样的事情。我的问题是我如何假设打印页面的宽度/高度为？或者有更好的解决方案吗？

我该如何处理？提前谢谢。

编辑：我使用特定于印刷品的css，fyi。我也有特定的媒体风格和打印样式。

编辑（尝试可视化）

-------div 1------ 
 |                 |
 |                 |
 |                 |
  -----div 2-----
 |                 |         WRONG
 |                 |
 |                 |
  ----div 3-------
 |                 |
 |                 |
 |  auto page break|
 ----page 1 ends---- 
 |                 |
 |                 |
 |                 |
 ----div 4----------


 -------div 1------ 
 |                 |
 |                 |
 |                 |
  -----div 2-----
 |                 |         RIGHT
 |                 |
 |   script 
    generated 
     page break    |
  ----div 3-------
 |                 |
 |                 |
 |                 |
 ----page 1 ends---- 
 |                 |
 |                 |
 |                 |
 ----div 4----------

Answer 1

确保使用为打印定义的CSS：

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

如果您的CSS将media属性设置为screen或print或all以外的其他属性，则打印机将无法看到您的CSS。

Answer 2

没关系。我假设宽度为600，高度为800.我没有找到最佳组合，但这也有效。

感谢您的帮助。

打印html页面 - 分页

2 个答案: