6

次のように設定されたiText空飛ぶ円盤ページを構築するために使用されるhtmlとcssがあります...

<html>
    <head>
        <style type="text/css">
            body { padding: 5px; }

            .footer {
                position: running(footer);
                font-size: 11px;
                text-align: center;
            }

            @page {
                @bottom-center {
                    content: element(footer)
                }
            }

            .pagenumber:before {
                content: counter(page)
            }

            .pagecount:before {
                content: counter(pages)
            }
        </style>
    </head>
    <body>
        <div class="content">
            lots of content that spans multiple pages in here...
        </div>
        <div class="footer">
            Page <span class="pagenumber"></span> of <span class="pagecount"></span>
        </div>
    </body>
</html>

フッターが最後のページにしか表示されないのはなぜですか?

4

1 に答える 1

19

「コンテンツ」が 1 ページに収まるほど小さい場合、フッターはそのページで問題なく表示されます。「コンテンツ」が複数のページにまたがると、フッターは最後のページにのみ表示されます。

すべてのページに表示するには、コンテンツの前にフッターを配置する必要があることがわかりました...

<div class="footer">
    Page <span class="pagenumber"></span> of <span class="pagecount"></span>
</div>
<div class="content">
    lots of content that spans multiple pages in here...
</div>

ヘッダーが含まれている場合は同じように見えます...ページコンテンツの前にある必要があります。

これに関連するいくつかのリンク (最後のリンクは、html/css の適切な形式の例です):

于 2013-11-06T20:43:59.497 に答える