📜  CSS page-break-before属性

📅  最后修改于: 2020-11-05 05:19:53             🧑  作者: Mango

CSS page-break-before属性

顾名思义,此CSS属性用于在打印文档时在元素之前添加分页符。在打印文档期间,它将在指定元素之前插入一个分页符。我们不能在绝对定位的元素或空白元素上使用此CSS属性

不生成框的元素。

此CSS属性表示是否允许在元素框之前使用分页符。包括page-break-before在内的CSS属性page-break-after和page-break-inside可以帮助我们定义文档在打印时的行为。

句法

page-break-before:  auto | always | left | right | avoid | initial | inherit;

可能的值

此CSS属性的值的简要说明列表如下。

Values Description
auto It is the default value that inserts a page break before the element, if necessary.
always This value always forces a page break before the specified element.
avoid It is used to avoid a page break before the element whenever possible.
left This value forces either one or two page breaks before the element so that the next page will be depicted as the left-hand page.
right The right value forces either one or two page breaks before the element so that the next page will be depicted as the right-hand page.
initial It sets the property to its default value.
inherit If this value is specified, the corresponding element uses the computed value of its parent element page-break-before property.

让我们使用每个示例来了解上述值。

示例-使用自动值

值auto是默认值,可在需要时自动插入分页符。在这个例子中,我们使用两个

元素和一个按钮。该按钮负责print页面。单击按钮后,我们将看到该值的效果。


    
      
   
   
      

Hello World!!

Welcome to the javaTpoint.com.

This site is developed so that students may learn computer science related technologies easily. The javaTpoint.com is committed to providing easy and in-depth tutorials on various technologies. No one is perfect in this world, and nothing is eternally best. But we can try to be better.

输出量

示例-使用Always值

无论是否需要,此值始终会迫使我们插入分页符。我们正在使用一个按钮来print页面。我们必须单击该按钮才能看到效果。

在此示例中,分页符在

元素,因此该按钮将不会打印在下一页上。如果在元素之后应用,则在
元素,该按钮将在下一页上print。


    
      
   
   
      

Hello World!!

Welcome to the javaTpoint.com.

This site is developed so that students may learn computer science related technologies easily. The javaTpoint.com is committed to providing easy and in-depth tutorials on various technologies. No one is perfect in this world, and nothing is eternally best. But we can try to be better.

输出量

示例-使用左值

左值强制插入一个或两个分页符,以便下一页的格式将为左页。


    
      
   
   
      

Hello World!!

Welcome to the javaTpoint.com.

This site is developed so that students may learn computer science related technologies easily. The javaTpoint.com is committed to providing easy and in-depth tutorials on various technologies. No one is perfect in this world, and nothing is eternally best. But we can try to be better.

输出量

示例-使用正确的值

right值将强制插入一个或两个分页符,以便将下一页的格式设置为正确的页面。


    
      
   
   
      

Hello World!!

Welcome to the javaTpoint.com.

This site is developed so that students may learn computer science related technologies easily. The javaTpoint.com is committed to providing easy and in-depth tutorials on various technologies. No one is perfect in this world, and nothing is eternally best. But we can try to be better.

输出量