仅在最后一页显示页脚
Show footer only on last page
我使用带有 itext 2.17 的 flyingsaucer 9.1.1 来生成 pdf 文件。
如何只在最后一页显示页脚(可以是 div、table 或 img 元素)?
不幸的是,CSS 定义了 page:first
伪元素,但没有定义 page:last
.
您仍然可以利用 bug 飞碟,使页脚仅在声明后出现。因此,如果将页脚 div
放在 HTML 的末尾,它只会出现在最后一页。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
.newpage{page-break-before:always}
@page{@bottom-center {content: element(footer)}}
#footer {position: running(footer);}
}
</style>
</head>
<body>
<div>Page 1 content</div>
<div class="newpage">Page 2 content</div>
<div class="newpage">Page 3 content</div>
<div id="footer">Footer on last page</div>
</body>
</html>
如果您希望每页都有一个页脚,但最后一页的内容不同,它也适用。您只需在 HTML.
中定义页脚 div
两次
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
.newpage{page-break-before:always}
@page{
@bottom-center {content: element(footer)}}
#footer {position: running(footer);}
}
</style>
</head>
<body>
<div id="footer">Footer for all pages except last</div>
<div>Page 1 content</div>
<div class="newpage">Page 2 content</div>
<div class="newpage">Page 3 content</div>
<div id="footer">Footer on last page</div>
</body>
</html>
我使用带有 itext 2.17 的 flyingsaucer 9.1.1 来生成 pdf 文件。
如何只在最后一页显示页脚(可以是 div、table 或 img 元素)?
不幸的是,CSS 定义了 page:first
伪元素,但没有定义 page:last
.
您仍然可以利用 bug 飞碟,使页脚仅在声明后出现。因此,如果将页脚 div
放在 HTML 的末尾,它只会出现在最后一页。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
.newpage{page-break-before:always}
@page{@bottom-center {content: element(footer)}}
#footer {position: running(footer);}
}
</style>
</head>
<body>
<div>Page 1 content</div>
<div class="newpage">Page 2 content</div>
<div class="newpage">Page 3 content</div>
<div id="footer">Footer on last page</div>
</body>
</html>
如果您希望每页都有一个页脚,但最后一页的内容不同,它也适用。您只需在 HTML.
中定义页脚div
两次
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
.newpage{page-break-before:always}
@page{
@bottom-center {content: element(footer)}}
#footer {position: running(footer);}
}
</style>
</head>
<body>
<div id="footer">Footer for all pages except last</div>
<div>Page 1 content</div>
<div class="newpage">Page 2 content</div>
<div class="newpage">Page 3 content</div>
<div id="footer">Footer on last page</div>
</body>
</html>