Question

我有一个网页，其中包含一个动态填充的表格。此页面需要打印出来以备记录。我遇到的问题是避免tr内的分页符。我花了很多时间进行谷歌搜索和尝试很多东西，我能够制作的是一个不会在正确位置打破的页面，因此缺少一些数据。我有一个简单的小型打印CSS页面

.noprint{
display: none;
}
.printthis { 
display: block; 
} 
.data table{ 
page-break-inside:avoid;
}
.data tr{
page-break-inside:avoid;
}
.data thead{
display:table-header-group;
}
.data tbody{
display:table-body-group;
page-break-inside:avoid;
}
.data,
.data th,
.data td {
border:1px solid #000;
border-spacing:0;   
border-collapse:collapse; 
}
.data table,th, tbody, tr, td {
background-color:transparent;
padding: 0px;
margin: 0px;
}
a:link:after, #content a:visited:after {
content: " (" attr(href) ") ";
text-decoration: none;
font-size: 90%;
display: none;
}
a[href^="/"]:after {
text-decoration: none;
display: none;
}

我只是试图在这张表中打印出我已经完成的结果，我只需要一些帮助就可以让它在正确的位置打破。任何hlep表示赞赏

Answer 1

尝试插入带有额外属性的css

media=print

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

现在使用选项

window.print()

只会激活此css并且您的打印页面将应用此css

Answer 2

是否在所有浏览器中拆分行？

我遇到了类似的问题：

tr {page-break-inside:avoid;}

为我工作，但你似乎已经有了这个。
也许你的css规则没有覆盖行，尝试使用所选浏览器中的开发人员工具栏来检查表行的应用css规则。

至于每页顶部的打印表头，看起来IE是目前唯一支持此功能的浏览器。
基于网络工具包的浏览器目前不支持它：
Bug 17205 - THEAD & TFOOT should be printed on every page

打印网页

2 个答案: