Zarządzanie nagłówkami, stopkami i podziałami stron w plikach PDF
Podzialy stron mogą być mylace.
Regula CSS page-break-after zawsze zadziała, jeśli zostanie poprawnie zastosowana. Jednak ta reguła nie zadziała, jeśli twój arkusz stylów zmieni div z display:block. Upewnij się, że reguła page-break-after jest zastosowana do elementu blokowego, najlepiej do div, który jest bezpośrednim dzieckiem tagu body.
Poniższy przykład HTML demonstruje:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Print Page Breaks with Header and Footer</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header, footer {
position: fixed;
width: 100%;
text-align: center;
background-color: #f1f1f1;
padding: 10px 0;
}
header {
top: 0;
}
footer {
bottom: 0;
}
.content {
margin: 150px 20px; /* Adjust margins to prevent content overlap with header and footer */
}
.page-break {
page-break-after: always;
display: block; /* Ensure it remains a block-level element */
}
</style>
</head>
<body>
<header>
<h1>Document Title</h1>
<p>Header Content</p>
</header>
<footer>
<p>Footer Content</p>
</footer>
<div class="content">
<div class="page-break">
<h2>Section 1</h2>
<p>This is the first section. After this section, there will be a page break.</p>
</div>
<div class="page-break">
<h2>Section 2</h2>
<p>This is the second section. The header and footer continue to be displayed, and the content starts on a new page.</p>
</div>
</div>
</body>
</html>Jeżeli zamiast tego potrzebujesz powtarzalnych nagłówków i stopek tabel na każdej stronie PDF, zapoznaj się z tym artykułem: Dodaj lub unikaj podziałów strony w HTML PDF
Jeśli powyzsze kroki nie rozwiązuja Twojego problemu, sproboj następujących krokow:
1. Uprosc problem
Jeśli Twoja treść zroznicowana jest pod wzgledem dlugosci, przetestuj treści różnej dlugosci, aby upewnic sie, ze używasz wlasciwego HTML/CSS. Możesz uzyc tego narzędzia do pomocy.
2. Zweryfikuj swoj HTML i CSS
Validator CSS może zostac uzyty do sprawdzenia stylu uzytego w CSS.
Validator HTML może pomoc Ci w weryfikacji twojego wejscia HTML.
Dodatkowo, możesz poprosic swojego projektanta o sprawdzenie HTML, sledzac zmiany.
Z drugiej strony, pozycjonowanie sekcji ujawnienia jest zależne od wielu czynników, w tym struktury tabeli, tfoot i wielu innych. Podwojne sprawdzenie ciągu i struktury HTML z pewnoscia pomoże.
3. Sprawdz wynik w podgladzie drukowania Chrome
IronPDF wygeneruje identyczny PDF jak przeglądarka Chrome na pulpicie, dzięki użyciu silnika renderowania PDF Chrome w IronPDF.
Dlatego możesz sprawdzic wyglad swojego HTML za pomoca podgladu drukowania Chrome i odpowiednio dostosować HTML. Może to wymagac metody prób i błędów, ale jest to najłatwiejszy sposob na debugowanie HTML.
Dowiedz sie, jak debugowac swoj HTML przez podglad drukowania Chrome: Formatowanie HTML pixel perfect
Zapoznaj sie z tym artykułem, aby uzyskać więcej informacji na temat silnika renderowania PDF Chrome: Czym jest Chrome Renderer IronPDF?
4. Uzyj narzędzi deweloperskich Chrome
Możesz również uzyc Inspect w narzędziach deweloperskich Chrome, aby wyszukac obliczone koncowe CSS w elementach. To dostarczy więcej szczegółowych informacji o kazdym elemencie HTML w ciągu.
5. Renderuj HTML używając IronPDF
Wyślij swoje sfinalizowane HTML jako ciąg znaków lub plik HTML do IronPDF Chrome Renderer i używaj metody RenderHtmlAsPdf() lub RenderHtmlFileAsPdf() do stworzenia dokumentu PDF.
Może być konieczne okreslenie niektorych opcji renderowania dla renderer'a, aby doprecyzowac wynikowy plik PDF oraz operacje renderowania. Zobacz ten artykuł, aby dowiedziec sie więcej.
Curtis Chau posiada tytuł licencjata z informatyki (Uniwersytet Carleton) i specjalizuje się w front-endowym rozwoju, z ekspertką w Node.js, TypeScript, JavaScript i React. Pasjonuje się tworzeniem intuicyjnych i estetycznie przyjemnych interfejsów użytkownika, Curtis cieszy się pracą z nowoczesnymi frameworkami i tworzeniem dobrze zorganizowanych, atrakcyjnych wizualnie podręczników.
