分页符和css - 如何跳过最后一页？

Question

我有分页和css的问题:

我有这个html代码(由php生成)

<div class="form-table courses">
coursename and pupils...
</div>
<div class="form-table courses">
coursename and pupils...
</div>
<div class="form-table courses">
coursename and pupils...
</div>

我的css是这样的:

.form-table.courses {page-break-after:always;}

上面将生成4页,因为它甚至在上面的第三个div之后设置了分页符.是否有任何"简单"的方法来获得3页？

我在考虑css的last-child属性,但我理解在IE8及以下版本中不支持这种情况 - 而且这还不够好(它必须至少处理ie8 - 优选ie7).

当然我可以为最后一个div添加一个类,然后像这样修改css:

<div class="form-table courses">
coursename and pupils...
</div>
<div class="form-table courses">
coursename and pupils...
</div>
<div class="form-table courses lastpage">
coursename and pupils...
</div>

并将此行添加到我的CSS:

.form-table.courses.lastpage {page-break-after:"";}

我的解决方案是唯一具有某种跨浏览器兼容性的解决方案吗？或者我错过了一些我应该使用的css的属性/值？

Answer 1

另一种更具可读性的方法是

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

.page-break:last-child {
    page-break-after: avoid;
}

这将在除最后一个之外的所有div之后中断

<div id="container">
<div class="form-table page-break">
 <!-- First Child -->
 coursename and pupils...
</div>
<div class="form-table page-break">
 <!-- Second Child -->
 coursename and pupils...
</div>
<div class="form-table page-break">
 <!-- Third Child -->
 coursename and pupils...
</div>
<div class="form-table page-break">
 <!-- Last Child -->
 coursename and pupils...
</div>
</div>

Answer 2

first-child 支持到IE7,所以我会做以下事情:

.courses {
    page-break-before: always;
}

.courses:first-child {
    page-break-before: avoid;
}

我希望有所帮助.