Html 在页面上仅打印完整div

我有一个页面上有大约20个div，一个在另一个下面。 我想做的是这样打印页面：

• 4个div完全放在一个打印页上
• 第5部分的前半部分打印在第1页，另一半打印在第2页
• 这对所有20个div都是重复的
• 我想要第页的前4个div 第一页和第二页开始 第五组等等

因此，每个打印页将只包含完整的div。 此外，还不知道div的高度。因此，每页可以有1或7个完整div

编辑： 我以前尝试过所有分页符和内部分页符选项

请尝试：

请尝试以下方法：

---

不能完全按照您希望的方式使用CSS。要做到这一点，您需要像纸张大小这样的信息<“代码>内部分页符”是您所能做的最好方法，但这并不能保证。

不能完全按照您希望的方式使用CSS。要做到这一点，您需要像纸张大小这样的信息<代码>内部分页符是您所能做的最好的方法，但这并不能保证。

您可能可以使用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";
        }
    }
}

函数paginateDivs（）{
var pageHeight=800；//在此处使用不同的值进行实验，结果如下
//是800像素。
var lastPage=0；
var divs=document.getElementsByTagName（“div”）；
对于（变量i=0；ipageHeight）{
lastPage=divs[i]。offsetTop；
divs[i].style.pageBreakBefore=“始终”；
}
}
}

您可能可以使用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";
        }
    }
}

函数paginateDivs（）{
var pageHeight=800；//在此处使用不同的值进行实验，结果如下
//是800像素。
var lastPage=0；
var divs=document.getElementsByTagName（“div”）；
对于（变量i=0；ipageHeight）{
lastPage=divs[i]。offsetTop；
divs[i].style.pageBreakBefore=“始终”；
}
}
}

不幸的是，它没有做到这一点。

内部分页符

还没有得到广泛支持（请参阅）。不幸的是，它没有做到。

内部分页符

还没有得到广泛支持（请参阅）。这是一个很酷很有用的解决方案，但我不能使用javascript。这是一个很酷很有用的解决方案，但我不能使用javascript。