3

我已经阅读了这里和其他地方提出的很多问题，我很困惑为什么分页符似乎对我不起作用。我创建了一个如下所示的测试 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:avoid 它在 IE 或 FF 中绝对没有效果。如果我尝试 page-break-after:avoid 或 page-break-after:auto 它似乎对简单的 html 文档没有任何影响。我是不是错过了什么。有没有人可以在 Explorer 和 FireFox 中使用的解决方案？

4

1 回答 1

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>
于 2010-06-29T15:30:08.043 回答