CSS
HTML
JavaScript
PHP
Introduzione
Coming Soon
Generatori
Varie

CSS page-break-after

La proprietà CSS2 page-break-after forza un'interruzione di pagina dopo un elemento

La proprietà page-break-after, introdotta in CSS2, viene utilizzata per controllare le interruzioni di pagina nei documenti stampati. È ideale per separare sezioni, capitoli o gruppi di contenuti che devono iniziare su una nuova pagina nel formato cartaceo.

Sintassi

page-break-after: valore;

Significato dei valori principali:

  • auto: Comportamento predefinito; nessuna interruzione di pagina forzata dopo l’elemento.

  • always: Inserisce sempre un’interruzione di pagina dopo l’elemento.

  • avoid: Evita, se possibile, l’interruzione di pagina dopo l’elemento.

  • left: Inserisce un'interruzione in modo che la pagina successiva inizi su una pagina dispari (lato sinistro in stampa fronte-retro).

  • right: Inserisce un'interruzione in modo che la pagina successiva inizi su una pagina pari (lato destro in stampa fronte-retro).


Esempio proprietà: page-break-after


Codice Esempio: page-break-after

CODE: CSSpreleva codice
  1. @media print {
  2.   .page-break-example {
  3.     page-break-after: always;
  4.   }
  5. }

Contenuto Esempio: page-break-after

Esempio di utilizzo di page-break-after (solo in stampa)

In questo esempio, una interruzione di pagina viene forzata dopo il primo paragrafo, ma è visibile solo nella modalità di stampa:


Sezione 1

Questa sezione verrà seguita da un'interruzione di pagina quando il documento viene stampato.

Sezione 2

Questa sezione inizierà su una nuova pagina in stampa, grazie alla regola page-break-after: always.


CSS e HTML per il salto pagina:

  
  <style>
    @media print {
      .page-break-example {
        page-break-after: always;
      }
    }
  </style>

  <div class="page-break-example">
    <h2>Sezione 1</h2>
    <p>Contenuto da stampare.</p>
  </div>

  <div>
    <h2>Sezione 2</h2>
    <p>Nuova pagina in stampa.</p>
  </div>
  

Note:
Le indicazioni dei Browser supportati sono superate grazie alla loro costante evoluzione, si consiglia di verificare la compatibilità dei vari browser eseguendo il test cliccando qui sotto.

Supporto Browser

Browser Support

I Cookie su questo sito:

Il nostro sito utilizza cookie e altre tecnologie in modo tale che sia noi, sia i nostri partner, possiamo ricordarci di te e capire come tu e gli altri visitatori utilizzate il nostro sito. Qui puoi trovare ulteriori informazioni sui cookie e le altre tecnologie. Chiudendo questo banner o continuando la navigazione acconsenti all'uso dei cookie. Acconsento Info Cookies