CSS page-break-inside 属性

顾名思义，此 CSS 属性用于在打印文档时指定元素内的分页。此 CSS 属性不能用于绝对定位的元素或不生成盒模型的空 <div> 元素。它会在打印文档时在指定元素内部插入或避免分页。

如果我们想在图像、列表项、代码片段、表格内部避免分页，可以使用 page-break-inside 属性。

此 CSS 属性表示是否允许在元素框内分页。除了 page-break-inside，CSS 属性 page-break-before 和 page-break-after 还可以帮助我们定义文档打印时的行为。

语法

可能的值

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

让我们通过每个值的示例来理解上述值。

示例 - 使用 auto 值

值 auto 是默认值，会在需要时自动插入分页。此值既不阻止也不强制在元素框内分页。

在此示例中，我们使用了两个 <div> 元素和一个按钮。按钮负责打印页面。点击按钮后，我们将看到该值的影响。

输出

示例 - 使用 avoid 值

此值在可能的情况下会避免在元素框内分页。在这里，我们使用一个按钮来打印页面。我们需要点击该按钮才能看到效果。

输出