html2pdf Corrección de Salto de Página en C# (Tutorial para Desarrolladores)

IronPDF: La biblioteca PDF de C

IronPDF es una biblioteca de PDF para C# flexible, fácil de usar y altamente personalizable que permite a los desarrolladores, principiantes o veteranos, manipular y editar completamente PDFs. Proporciona muchas formas para que los desarrolladores conviertan diferentes formatos, como HTML, RTF e Imágenes, en PDFs y editen además cómo se renderiza al convertir a PDF. Además, IronPDF utiliza un motor de renderizado de Chrome y, como tal, es altamente competente en renderizar cadenas HTML, y permite a los desarrolladores usar estilos CSS para personalizar aún más el documento HTML, dándoles ventaja en términos de personalización y presentación visual que no encontrarás en ningún otro lugar.

Dado que la biblioteca utiliza un motor de renderizado de Chrome, lo que ves es lo que obtienes al renderizar HTML, lo que lo hace ideal para operaciones como crear plantillas para saltos de página, así no hay desajustes de las plantillas. Es precisamente cómo diseñaste las plantillas al convertirlas en PDFs.

Añadir salto de página en PDF

Para ilustrar la flexibilidad y facilidad de uso de la biblioteca, utilizaremos un ejemplo de código que muestra cómo agregarías saltos de página de forma programática.

En este escenario, usaremos un PDF basado en tablas como entrada, y veremos la diferencia entre agregar el salto de página inmediatamente y después para claridad visual.

// Replace the license key variable with the trial key you obtained
IronPdf.License.LicenseKey = "REPLACE-WITH-YOUR-KEY";

// Replace the license key variable with the trial key you obtained
IronPdf.License.LicenseKey = "REPLACE-WITH-YOUR-KEY";

' Replace the license key variable with the trial key you obtained
IronPdf.License.LicenseKey = "REPLACE-WITH-YOUR-KEY"

using IronPdf; // Import the IronPdf library

// Define the HTML content, including a table and an image
const string html = @"
  <table style='border: 1px solid #000000'>
    <tr>
      <th>Company</th>
      <th>Product</th>
    </tr>
    <tr>
      <td>Iron Software</td>
      <td>IronPDF</td>
    </tr>
    <tr>
      <td>Iron Software</td>
      <td>IronOCR</td>
    </tr>
  </table>
  <div style='page-break-after: always;'> </div> <!-- Ensures a page break after the table -->
  <img src='https://ironpdf.com/img/products/ironpdf-logo-text-dotnet.svg'>";

// Create an instance of ChromePdfRenderer
var renderer = new ChromePdfRenderer();

// Render the HTML content into a PDF
var pdf = renderer.RenderHtmlAsPdf(html);

// Save the PDF as "Page_Break.pdf"
pdf.SaveAs("Page_Break.pdf");

using IronPdf; // Import the IronPdf library

// Define the HTML content, including a table and an image
const string html = @"
  <table style='border: 1px solid #000000'>
    <tr>
      <th>Company</th>
      <th>Product</th>
    </tr>
    <tr>
      <td>Iron Software</td>
      <td>IronPDF</td>
    </tr>
    <tr>
      <td>Iron Software</td>
      <td>IronOCR</td>
    </tr>
  </table>
  <div style='page-break-after: always;'> </div> <!-- Ensures a page break after the table -->
  <img src='https://ironpdf.com/img/products/ironpdf-logo-text-dotnet.svg'>";

// Create an instance of ChromePdfRenderer
var renderer = new ChromePdfRenderer();

// Render the HTML content into a PDF
var pdf = renderer.RenderHtmlAsPdf(html);

// Save the PDF as "Page_Break.pdf"
pdf.SaveAs("Page_Break.pdf");

Imports IronPdf ' Import the IronPdf library

' Define the HTML content, including a table and an image
Private Const html As String = "
  <table style='border: 1px solid #000000'>
    <tr>
      <th>Company</th>
      <th>Product</th>
    </tr>
    <tr>
      <td>Iron Software</td>
      <td>IronPDF</td>
    </tr>
    <tr>
      <td>Iron Software</td>
      <td>IronOCR</td>
    </tr>
  </table>
  <div style='page-break-after: always;'> </div> <!-- Ensures a page break after the table -->
  <img src='https://ironpdf.com/img/products/ironpdf-logo-text-dotnet.svg'>"

' Create an instance of ChromePdfRenderer
Private renderer = New ChromePdfRenderer()

' Render the HTML content into a PDF
Private pdf = renderer.RenderHtmlAsPdf(html)

' Save the PDF as "Page_Break.pdf"
pdf.SaveAs("Page_Break.pdf")

Cómo controlar los saltos de página con CSS

Dado que IronPDF se puede personalizar con CSS, ya que utiliza un motor de renderizado de Chrome, podemos aprovechar esto y usar CSS para agregar saltos de página a elementos específicos y saltos de página dentro de ellos, así como especificar qué elemento no debería tener un salto de página dentro.

Por ejemplo, aunque en la imagen de arriba, el salto de página ocurre después de la tabla, puede haber momentos en que ocurra dentro de la tabla debido al desorden.

Para evitar eso, podemos usar un estilo CSS específico para el nodo y especificar que no queremos agregar un salto de página dentro.

<div style='page-break-inside: avoid'>
 <img src='no-break-me.png'>
</div>

<div style='page-break-inside: avoid'>
 <img src='no-break-me.png'>
</div>

Agregar page-break-inside: avoid evita saltos de página dentro del elemento. Sin embargo, al realizar esta operación, asegúrese de que esto se aplique al nodo div padre del elemento.

Una operación similar también se puede usar para elementos donde desea agregar un estilo de page-break-before.

<div style="page-break-inside: avoid;">
    <img src="no-break-me.png">
</div>

<div style="page-break-inside: avoid;">
    <img src="no-break-me.png">
</div>

Dado que podemos utilizar HTML, podemos especificar aún más los elementos de los nodos perforando el árbol de nodos HTML usando document.getElementById de JavaScript para seleccionar el elemento por su ID y asegurar que cada nodo sea completamente personalizable.

Optimización de la calidad de imagen y el tamaño de archivo

La configuración de salto de página está relacionada con la Calidad de Imagen. Querrás asegurarte de que la configuración de salto de página no afecte la calidad de la imagen encogiéndola o escalándola en la página siguiente.

Por lo tanto, podemos usar CSS para asegurar que la calidad de la imagen sea consistente a lo largo de las plantillas cuando aplicamos saltos de página.

<div class="no-break">
    <img src="optimized-image.jpg" alt="Optimized Image" style="width:100%; height:auto;">
</div>

<div class="no-break">
    <img src="optimized-image.jpg" alt="Optimized Image" style="width:100%; height:auto;">
</div>

El estilo CSS anterior asegura que la imagen sea consistente después de las operaciones de salto de página. Primero configuramos el ancho al 100% de la página, y la altura se puede escalar automáticamente para mantener la proporción de aspecto.

Además, IronPDF tiene opciones de renderizado adicionales cuando se maneja HTML, que son similares a la configuración de impresión de un usuario para mensajes de PDF imprimibles descargables. Para obtener una lista completa de atributos, consulte la documentación de la API.

Contrapartida con JavaScript

Dado que IronPDF tiene la ventaja de utilizar un motor de renderizado de Chrome, también viene con una versión de Node.js que permite a desarrolladores de diferentes antecedentes utilizar esta potente biblioteca.

Con la variante Node.js, los desarrolladores tienen un control aún más afinado sobre la adición de saltos de página, ya que tienen acceso a un uso basado en promesas y métodos, como el método de promesa onRejected para depuración o seguimiento de progreso y sus funciones intermedias también.

En comparación con una biblioteca común como html2pdf con su método de salida del objeto jsPDF, IronPDF es más flexible y admite múltiples idiomas, lo que permite a los desarrolladores con experiencia en diferentes idiomas trabajar en el mismo proyecto.

Conclusión

Entender cómo usar los saltos de página y cómo el CSS afecta el HTML en general es crucial para crear documentos presentables y visualmente atractivos para los usuarios. Permite a los lectores segregar la información que están leyendo para evitar la sobrecarga de información y la confusión. A lo largo de este artículo, hablamos sobre la utilización del potente motor de renderizado de Chrome que utiliza IronPDF para crear automáticamente plantillas de salto de página para plantillas y automatización, optimizando la eficiencia y escalabilidad al crear estos documentos, así como reduciendo el riesgo de error humano.

Para los desarrolladores que deseen probar IronPDF, la biblioteca ofrece una prueba gratuita para $799 y superior.