Page-Break-inside 属性在 chrome 中不起作用

Posted 2023-03-06

【中文标题】Page-Break-inside 属性在 chrome 中不起作用

【英文标题】：Page-Break-inside property is not working in chrome

【发布时间】：2013-09-22 13:05:15

【问题描述】：

我有一个长表数据，其中包含许多行和嵌套表。当我打印这些数据时，表格和嵌套表格的行只是在分页符处中断，这意味着表格和数据被分成页面，所以我在那里使用以下 CSS 属性：-

table tr 
 page-break-inside:avoid;
 position:relative;
 

但这在我的情况下不起作用，您可以在此处查看现场演示：--http://jsfiddle.net/npsingh/S8vr8/2/show/

请通过以下链接编辑代码：--http://jsfiddle.net/npsingh/S8vr8/2/ ---[打印页面只需按[CTRL+P]或右键单击并单击打印选项]---

我使用的是 Google Chrome 版本 29.0.1547.66 m

请让我知道问题出在哪里。 谢谢

【问题讨论】：

***.com/questions/1630819/…

我已经完成了所有这些事情，我阅读了很多关于堆栈溢出的帖子，但在我的情况下没有任何工作。

【参考方案1】：

这对我有用，原来是 body css：

body
    height: auto!important;
    float: none!important;

【参考方案2】：

不要将page-break-inside:avoid; 放在桌子的 tr 上，而是尝试像这样直接将其应用到桌子上：

table 
    page-break-inside:avoid;
    position:relative;

同时添加这个媒体查询：

@media print 
   table 
        page-break-inside:avoid;
        position:relative;