html - 使用page-break-after在6格后中断页面？

这是我的打印页，
这是我的html一瞥，

<style>
    .container{
        float: left;
        border: 1px solid Black;
        width: 400px;
        height: 350px;
        margin: 10px;
        padding: 10px;
        page-break-inside: avoid;
    }
    .container img{
        max-width: 200px;
        max-height: 200px;
    }
</style>
<div class="container">
    <b>Name: </b>@Product.Name<br />
    <b>Model: </b>@Product.ModelNumber<br />
    <img src="@Product.ImagePath" /><br />
    <span style="font-size: 20px">DetailedDescriptions</span><br />
    @foreach(var attr in Product.DetailedDescriptions){
        @attr.Header<br />
    }
    <span style="font-size: 20px">KeyAttributes</span><br />
    @foreach(var attr in Product.KeyAttributes){
        @attr.Name<br />
        @attr.Value<br />
    }
</div>

如何使用css确保每6个div之后的分页符

最佳答案

你可以这样做：
FIDDLE

.wrapper div:nth-child(6n)
{
    margin-bottom: 300px;
}

这意味着：每6个容器之后，添加一个x px的底边距（你需要多少），这样它就把下一个框推到下一页。

关于html - 使用page-break-after在6格后中断页面？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17698026/