如何使div仅在特定高度打印?

我正在打印包含两个主要div的表单。一旦打印出来,将从纸上切下一个,而另一个仅包含有关客户的信息。问题在于第二个div的大小取决于我们对客户端本身拥有的信息量。因此,如果我们有许多有关特定客户端的信息,则需要打印多个页面。想要节省纸张,双面打印对我们来说很好。 css是否有一种方法或技巧可以使我们在需要多页打印的情况下使第二个div继续在某个高度继续运行,以便在剪切第一个div时,不会剪切出有关客户端的任何信息太。下面是所需结果布局的简单图片,其中红色框将要剪切,蓝色框将是客户信息所在的位置,虚线红色框仅是空白区域。

Desired Outcome Layout

lhbfqlz 回答:如何使div仅在特定高度打印?

使用@page css规则在除第一页之外的所有页面上设置页边距。边距以厘米为单位margin-top: 10cm;

@page:not(:first) {
    margin-top: <<height of the red div>>;

}

请注意,@page不允许定义除第一页之外的任何页面,因此该顶部间隙仍将出现在第三,第四等页面上。

还请注意,@page不支持Safari和其他浏览器:https://developer.mozilla.org/en-US/docs/Web/CSS/@page

本文链接:https://www.f2er.com/3163806.html

大家都在问