Using CSS to generate HTML to PDF, I have successfully added page numbers at the bottom and chapter names at the top of each page using @top-center in the CSS and HTML code below. The rendering is done with Prince.
However, I need a way to exclude the header on the first page of the chapter while retaining it on subsequent pages.
Please provide guidance on how to achieve this:
@page {
margin: 27mm 16mm 27mm 16mm;
size: 7in 9.25in;
}
div.chapter {
page: chapter;
}
h1 {
string-set: chapter content();
}
@page chapter:left {
@top-center {
font: 11pt "Bookerly", serif;
content: string(chapter, first);
vertical-align: bottom;
padding-bottom: 2em;
font-variant: small-caps;
color: #888888;
}
@bottom-center {
font: 11pt "Bookerly", serif;
content: counter(page);
padding-top: 2em;
vertical-align: top;
}
}
@page chapter:right {
@top-center {
font: 11pt "Bookerly", serif;
content: string(chapter, first);
vertical-align: bottom;
padding-bottom: 2em;
font-variant: small-caps;
color: #888888;
}
@bottom-center {
font: 11pt "Bookerly", serif;
content: counter(page);
vertical-align: top;
padding-top: 2em;
}
}