Stampa intestazione in ogni pagina

Question

Ho creato un report e il passaggio successivo è la creazione di un'intestazione che verrà stampata in ogni pagina. Ho provato a utilizzare le soluzioni offerte in How to use HTML to print header and footer on every printed page of a document?, ma non sembrano funzionare correttamente sui browser Webkit.

Avete qualche idea di implementare questa opzione nel mio rapporto?

Answer 1

Dai un'occhiata a questo: http://doctyper.com/archives/200808/fixed-positioning-on-mobile-safari/

Answer 2

intestazioni e piè di pagina di stampa su ogni pagina è compito molto difficile, se si utilizzano tag div. Nel mio progetto ho cercato quasi tutto il web e ho scoperto che per stampare le intestazioni e i piè di pagina ogni pagina devi usare tabelle e regole CSS, senza usare tabelle e css non puoi stampare intestazioni su ogni pagina. Io vi sto fornendo il codice per farlo come sotto:

<style> 
    @media screen{thead{display:none;}} 
    @media print{thead{display:table-header-group; margin-bottom:2px;}} 
    @page{margin-top:1cm;margin-left:1cm;margin-right:1cm;margin-bottom:1.5cm;}} 
</style> 

Prima regola CSS fare quel thead della tabella non verrebbe visualizzato sullo schermo per l'utente e Seconda regola definisce che durante thead la stampa viene visualizzato come tavolo- gruppo di intestazione poiché questa regola mostrerebbe l'intestazione su ogni pagina se si omette che queste intestazioni non vengano stampate su ogni pagina e la terza regola è per mantenere i margini della pagina dalla sovrapposizione di intestazione o piè di pagina e il codice HTML sarà come sotto:

<table> 
    <thead> 
     <tr> 
      <th> <--- Your header text would be placed here ---> </th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td> 
       <--- Your printing text would be place here ---> 
      </td> 
     </tr> 
    </tbody> 
</table> 

Ultima cosa, ho provato il codice cosa su IE, Safari, Firefox e Chrome e vorrei dirvi che su Chrome la testata r è stampato solo sulla prima pagina. Avevo anche segnalato il bug molte volte ma Chrome non stava facendo nulla riguardo a questo problema.

Answer 3

È possibile utilizzare iframe ma non lo consiglio nessuno lo usa.

Se crei i report dinamicamente, è meglio aggiungere l'intestazione alla pagina creata alla creazione. Questa è la tecnica più ampiamente utilizzata dopo tutto.

L'altra opzione potrebbe utilizzare la proprietà css content.

div#main:before { 
    content: "<p>I appear before the div tag</p><hr />" 
} 

Nota: IE8 supporta solo the content property Se viene specificato un !DOCTYPE.

Answer 4

Ad oggi il bug sulla webkit.org non è ancora risolto: https://bugs.webkit.org/show_bug.cgi?id=17205

Ho avuto lo stesso problema a lavorare con un motore webkit che converte HTML a PDF. Questo ha funzionato per me:

primo a rendere il vostro css disponibile per tutti i tipi di media

<style type="text/css" media="all"> 

assicurarsi che la proprietà di visualizzazione per thead è impostato:

thead { display: table-header-group;} 

ultimo, per risolvere i problemi in cui le righe del tavolo si sovrappongono alle intestazioni o alle righe che vengono tagliate a metà a fine pagina

table { page-break-inside:auto } 
tr { page-break-inside:avoid; page-break-after:auto } 
thead tr th{ height: 50px;}