是否存在頁面中斷後屬性的等效

Question

我知道在打印html文檔時使用了page-break-after，但瀏覽器是否相當？ 像我有這個網站：

<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 
} 

我需要每三格後一個分頁符（：第n -child（3n）），但我無法弄清楚如何添加它。有沒有辦法實現它（不添加新元素）？

Answer 1

Asuming你不能改變DOM（這我會建議），您可以用浮漂修復和清除：

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

所以你是浮動的div，但否認第四屆一個有一個元素在它的左邊，並因此在另一條線上強制它。

Fiddle example