打印CSS的大表

我有一个相当大的表，即分离成较小的部分与间隔行打印CSS的大表

<table> 
<tr><th>Heading</th>...</tr> 
<tr><td>Content</td>...</tr> 
<tr><td>Content</td>...</tr> 
<tr><td>Content</td>...</tr> 
<tr class='spacer_row'><td></td></tr> 
<tr><th>Heading</th>...</tr> 
<tr><td>Content</td>...</tr> 
<tr><td>Content</td>...</tr> 
<tr><td>Content</td>...</tr> 
<tr class='spacer_row'><td></td></tr> 
<tr><th>Heading</th>...</tr> 
<tr><td>Content</td>...</tr> 
<tr><td>Content</td>...</tr> 
<tr><td>Content</td>...</tr> 
<tr class='spacer_row'><td></td></tr> 
......... 
......... 
</table>

我创建一个print.css，我想强制分页符在spacer_row如果需要。如何使用分页符css属性？

来源

2011-03-04 Mr Hyde

更新：试验了一下之后就想起了。不同浏览器对print css的支持各不相同。更重要的是，浏览器似乎不允许在单个表格中有条件地定位分页符*，所以我认为我必须编写新的标记，每个部分都是一个单独的表格 – 2011-03-07 20:44:05

这CSS规则将确保一个新的页面将在每次间隔一行之后开始：

.spacer_row 
{ 
    page-break-after: always; 
}

见page-break-after。

来源

2011-03-04 20:17:28 Oded

我不希望它“始终”，只是如果需要的话，它被放置在'spacer_row' – 2011-03-04 20:19:45

@RisingSun - 然后只把它放在那些行上。您可以为这些行创建一个特殊的CSS类并将其添加到它们。 – Oded 2011-03-04 20:21:01

该表正在从数据库生成，我不会*知道*分页将在哪里。 3 - 5节很容易放在页面上 – 2011-03-04 20:24:55

试试这个，虽然我没有自己测试过。我在使用div，p和其他标签的页面上获得了很好的效果。可能的工作：

CSS（告诉浏览器，以避免一个TBODY标签内的分页符）

tbody {page-break-inside:avoid}

HTML（裹在每一组行中的tbody标签，并让您的间隔排）

<table> 
    <tbody> 
    <tr><th>Heading</th>...</tr> 
    <tr><td>Content</td>...</tr> 
    <tr><td>Content</td>...</tr> 
    <tr><td>Content</td>...</tr> 
    <tr class='spacer_row'><td></td></tr> 
    </tbody> 
    <tbody> 
    <tr><th>Heading</th>...</tr> 
    <tr><td>Content</td>...</tr> 
    <tr><td>Content</td>...</tr> 
    <tr><td>Content</td>...</tr> 
    <tr class='spacer_row'><td></td></tr> 
    </tbody> 
    <tbody> 
    <tr><th>Heading</th>...</tr> 
    <tr><td>Content</td>...</tr> 
    <tr><td>Content</td>...</tr> 
    <tr><td>Content</td>...</tr> 
    <tr class='spacer_row'><td></td></tr> 
    </tbody> 
    <tbody> 
    ......... 
    ......... 
    </tbody> 
</table>

这是一个很好的开始测试。

在生产中，我会避免实际上放入页面中断：避免在所有tbody标签上使用css，而是创建一个可应用于tbody或任何容器标签的css类。原因如下：我在IE中发现了一个错误（一直到IE8），如果你将那些CSS和IE强制分页的容器嵌套在一起，IE似乎会截断页面的其余部分。

不幸的是，这个w3schools.com page表示支持page-break-inside的唯一浏览器是opera。这里希望在未来有更好的支持

来源

2011-09-15 18:33:13 slolife

打印CSS的大表

回答

相关问题