Question

我已经阅读了这里和其他地方提出的很多问题，我很困惑为什么分页符似乎不适合我。我创建了一个测试html页面，如下所示：

<html>
    <head>
        <style type="text/css">
            @media all
            {
                .page-break { }
            }

            @media print
            {
                div {page-break-after:always; }
            }
        </style>
    </head>
    <body>
        <div class="page-break">
            1content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
        </div>
        <div class="page-break">
            2content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
            content content content content content content content content content content content content 
        </div>
...
</body>
</html>

我有九个这样的div。够简单吧？这很好用（它按预期将每个div放在一个单独的页面上）。现在对于IE和FF不起作用的东西。 我的目标是创建一个简单的html文档，永远不会破坏这9个div中的一个。如果我将div样式更改为page-break-inside：避免它在IE中完全没有效果或者FF。如果我尝试page-break-after：avoid或page-break-after：auto它似乎对简单的html文档没有任何影响。我错过了什么。有没有人有一个可以在资源管理器和FireFox中使用的解决方案？

Answer 1

不幸的是，Firefox不支持“page-break-inside”，因此最好的选择是使用“page-break-before：always”。 IE和Firefox支持这一点，并确保每个DIV都有一整页空间可供使用。我也不将该类应用于第一个DIV，因为这将迫使不必要的中断。这是标记：

<html>
    <head>
        <style type="text/css">
            @media print
            {
                .page-break { page-break-before: always; }
            }
        </style>
    </head>
    <body>
        <div>
            1content content content content content content content content content content content content 
            content content content content content content content content content content content content
        </div>
        <div class="page-break">
            2content content content content content content content content content content content content 
            content content content content content content content content content content content content
        </div>
...
</body>
</html>

IE和FF无法按预期工作的分页符

1 个答案: