문제

I have a specific document. Background first and last page is different from the other pages of the document.

According to the question answered here: Flying Saucer hide header and footer on first page

The first page I defined using the trick @page :first:

@page{      
    background-image: url('... my regular background ...');
}
@page :first {      
    background-image: url('... first page background ... ');
}

How to change the background on the last page?

도움이 되었습니까?

해결책

If you know in advance what will be displayed on the last page, you can use CSS3 named pages.

Here is a simple example:

<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);}

    @page last {@bottom-center {content: element(lastfooter)}}
    #lastfooter{position: running(lastfooter);}
    #lastpage  {page:last}
}
 </style>
</head>
    <body>  
        <div id="footer">Footer page 1 and 2</div>
        <div id="lastfooter">Footer for last page</div>

        <div>Page 1 content</div>
        <div class="newpage">Page 2 content</div>
        <div id="lastpage">Page 3 content</div>
    </body>
</html>
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top