Quebra de páginas no momento da impressão

Fernando Valler 10/01/2020 CSS, HTML


Para quem tem sistemas que fazem a emissão de boletos, é comum fazer a geração de vários boletos em uma mesma aba no navegador, o problema é que quando mandamos imprimir cada boleto deve estar em uma página separada.

Para essa função você pode usar o código abaixo:

.page-break {
   clear: both;
   page-break-before: always;
   page-break-inside: avoid;
}

Para usar faça a chamada da classe em CSS no seu código:

<p> .. Pagina 1 ....</p>
<p> .. conteúdo ....</p>
<div class="page-break"></div>

<p> .. Pagina 2 ....</p>
<p> .. conteúdo ....</p>
<div class="page-break"></div>

<p> .. Pagina 3 ....</p>
<p> .. conteúdo ....</p>
<div class="page-break"></div>

Assim onde estiver um page-break no momento da impressão será uma nova página.


Fernando Valler - Programador Web
Fernando Valler

Sou programador web, motivado por desafios e sempre buscando aprender algo novo. Aqui você pode encontrar alguns projetos.