Question

我知道page-break-after用于打印html文档，但有一个浏览器等效吗？就像我有这个HTML：

<div class="c1">
 <div>item1</div>
 <div>value11</div>
 <div>value12</div>
 <div>item2</div>
 <div>value21</div>
 <div>value22</div>
</div>

我希望看到类似

的内容

item1   value11   value12
item2   value21   value22

css：

.c1 > div{
display:inline-block
}
.c1 > div:nth-child(3n){
????page-break-after
}

每隔三个div（：nth-child（3n））之后我需要一个分页符，但我无法弄清楚如何添加它。有没有办法实现它（不添加新元素）？

Answer 1

假设您无法更改DOM（我建议），您可以使用浮动并清除它来修复它：

.c1 > div { float: left; margin-right: 10px; }
.c1 > div:nth-of-type(3n+1) { clear: left; }

所以你是浮动div，但是拒绝第4个在左边有一个元素，从而强迫它在另一条线上。