Todos los que nos dedicamos a la programación web sabemos que para imprimir una página web, es necesario usar la función print() de javascript, pero si deseamos imprimir documentos (como nóminas, albaranes, facturas, documentación oficial, etc), habitualmente necesitaremos imprimir esos documentos por triplicado o en hojas diferentes, y la manera más óptima de realizarlo sería crear un pdf que el usuario podría o bien descargar o visualizar para su impresión.
Pero gracias a CSS podemos imprimir varias páginas sin necesidad de usar pdf (a no ser que también quisieramos tener una copia en este formato 😉 )
CSS tiene varias propiedades para impresión:
page-break-after: Sirve para forzar un salto de linea después del elemento al que se le ha aplicado.
page-break-before: Sirve para forzar un salto de linea antes del elemento al que se le ha aplicado.
Ejemplo:
[codesyntax lang=»css»]
#salto_pagina_despues{
page-break-after:always;
}
#salto_pagina_anterior{
page-break-before:always;
}[/codesyntax]
Forma de utilización:
[codesyntax lang=»html4strict»]
<div id="salto_pagina_despues">Este elemento se imprimirá en la primera página.</div> <div>Este elemento se imprimirá en la segunda página.</div> <div id="salto_pagina_anterior">Este elemento se imprimirá en la tercera página.</div>
[/codesyntax]
Explicación:
La primera capa se imprimirá en la primera página, por que le hemos indicado que después del elemento con el id «salto_pagina_despues» se genere un salto de página. El segundo «div» se imprimirá en la segunda página porque le hemos indicado a la capa con el id «salto_pagina_anterior» que antés de procesar el contenido de la capa con ese id, genere un salto de linea.
Es algo muy útil he intuitivo. Espero que os sirva. XD
