Question

我有以下的HTML代码

<div id="allPages"><div class="wrapper chromefix pagebreakbefore">
        <!-- the rows of a grid need to be contained with a div marked with the 'grid' class; I set the height of this div just to simulate space-->
        <div class="row">
            <!-- row of th grid-->
            <div class="col p-25 al">
                <div style="width: 160px; height: 50px;">.....

Pagebreakbefore之前基本上会在名称指定之前添加分页符。

.pagebreakbefore {
page-break-before: always;
-webkit-break-before: always;
break-before: always;

}

现在在打印预览期间，我在FF和IE11的开头得到一个空白页面。我能够使用下面的css样式在FF中解决这个问题

@media print{
.pagebreakbefore:first-child { display: block; page-break-before: avoid; }
.pagebreakbefore { display: block; page-break-before: always; }

}

但它似乎不适用于IE11。还有另一个原因，我必须在之前而不是之后使用分页符。所以这不是一个选择。任何人都可以告诉我为什么以及如何让它在IE11中工作？

Answer 1

这适合我...主要＆＃39;中的第一个数字元素。元素是封面。在该部分关闭后，后续的部分和表单元素（＆＃39; main＆＃39;的子元素）控制中断。

<style media="print">
figure[role=heading],*[role=main] section,form{display:block!important;visibility:visible!important;height:auto; page-break-after:always;-webkit-break-after: always;break-after:always }
*[role=main] section,form{ page-break-before:always;-webkit-break-before: always;break-before:always }
</style>

....你不应该在你的主要孩子的第一个孩子面前休息。元件。

Answer 2

问题是显示风格。我不知道为什么它按照它的方式行事，但我修改了css如下，现在它工作正常：

@media print {
.pagebreakbefore:first-child {
    display: inline !important;
    page-break-before: avoid !important;
}

.pagebreakbefore {
    page-break-before: always !important;
}
}

在IE11中打印预览期间如何避免分页？

2 个答案: