僅在頁面上打印完整的DIV

Question

我有一個頁面，其上有大約20個div。 我想要做的是打印這樣的頁面：

• 4個div完全放在一個打印頁面上。
• 第5個div的前半部分印在第1頁上，另一半在第2頁上。
• 這個重複的所有20個div。
• 我想有第 一個第一個4 divs和第二個頁面開始 div 5等等。

所以每個打印的頁面將只包含完整的div。 也不知道div高度。所以每頁可以有1或7個完整的div。

編輯： 我已經嘗試了所有分頁符，之前和分頁，裏面的選項

Answer 1

不能做到這一點完全符合您的方式CSS。要做到這一點，您需要紙張大小等信息。 page-break-inside是你可以做的最好的，但它不是一個保證。

Answer 2

嘗試page-break-inside property：

div { 
    page-break-inside: avoid; 
} 

Answer 3

你也許能夠用javascript來獲取某些東西。您可以測量每個div的offsetHeight和offsetTop，並將其與每個頁面的預期高度（以像素爲單位）進行比較。你必須嘗試不同的頁面高度才能得到它，但這樣的東西可能會工作：

function paginateDivs() { 

    var pageHeight = 800; // Experiment with different values here, this 
          // is 800 pixels. 
    var lastPage = 0; 

    var divs = document.getElementsByTagName("div"); 

    for (var i = 0; i < divs.length; i++) { 
     var divBottom = divs[i].offsetTop + divs[i].offsetHeight; 
     if (divBottom - lastPage > pageHeight) { 
      lastPage = divs[i].offsetTop; 
      divs[i].style.pageBreakBefore = "always"; 
     } 
    } 
}