39 votes

Existe-t-il un moyen d’imprimer un en-tête / pied de page Web sur chaque page?

D'après mes recherches, il semble que ce que je veux faire n'est pas possible, mais dans le cas où quelque chose a changé, je voulais vérifier pour voir si quelqu'un avait une façon de le faire.

J'ai une application web qui génère des rapports pour imprimer basé sur les sélections de l'utilisateur dans la fenêtre du navigateur. J'ai personnalisé en-tête et pied de page, lorsque le rapport est imprimé à partir du navigateur, devrait être répétée sur chaque page imprimée. Il n'est pas le navigateur de l'en-tête et pied de page j'ai besoin, mais plutôt l'habitude que je générer. Aussi, je ne pense pas que c'est un problème de CSS et autres types de médias, mais je ne suis pas un CSS expert. Je n'ai pas de problèmes à obtenir l'en-tête et pied de page pour imprimer une fois, mais je n'arrive pas à imprimer sur chaque page. J'ai lu que peut-être si j'ai recréé mon rapport de pages à l'aide de tableaux, et ensuite utilisé la table de balises d'en-tête et le CSS, qui peut fonctionner à moins d'obtenir l'en-tête sur chaque page. Je n'ai pas eu de succès avec cela, mais je vais essayer à nouveau si c'est la seule option. Un collègue m'a suggéré de compter les lignes dans mon php et de mettre manuellement l'en-tête et pied de page comme requis. Je suppose que c'est une option, mais il semble juste comme il devrait y avoir un moyen de le faire ce qui n'est pas si "force brute"!

L'autre problème, c'est que j'ai pour soutenir IE 6, donc je suppose qu'une partie de la CSS choses que j'ai essayé sont tout simplement pas pris en charge.

Si quelqu'un sait de toute façon pour ce faire, ce serait génial! Si il n'y en a pas, je vais repenser mon approche.

Merci à l'avance!

Mise à JOUR (14 Décembre 2011)

J'ai fait des progrès considérables avec cette question, et à l'aide de certaines des informations à partir des réponses, j'ai fait de produire des rapports qui soient utilisables, mais jamais aussi beau ou aussi professionnel que je voulais. Pieds ont tendance à être pas assez près du bas de la page, j'ai eu à faire beaucoup de travail de supposition et "fragile" calculs quant au texte va être de décider sur l'insertion de sauts de page, je ne pouvais que soutenir un ensemble limité de formats de page, et de toute modification de ces rapports a entraîné une cascade de changements de code et encore plus cassant les calculs. Il y a toujours un scénario qui a brisé une partie de certains rapports. Nous revisted les exigences, et sont maintenant générer des rapports au format Pdf à l'aide de TCPDF. La documentation est un peu opaque, et il prend de l'expérimentation, mais les résultats sont de loin supérieurs et maintenant les rapports apparaissent comme ils le devraient. Je voudrais dire à toute personne qui essaie de faire des rapports au format HTML à partir du navigateur, sauf si elles sont très simple, enregistrez-vous la frustration (comme d'autres m'ont dit ici) et aller avec les fichiers Pdf ou quelque chose de similaire.

34voto

Chris J Points 12904

Il peut être fait avec des tables -- et je sais que je vais prendre le risque d'une downvote en suggérant d'utiliser des tableaux pour la mise en page - mais nous parlons IE6 ici qui n'est pas connue pour son fantastique support de CSS :-)

Si vous définissez un style CSS comme suit:

thead { display: table-header-group; }
tfoot { display: table-footer-group; }

Ensuite, lorsque vous créez votre HTML, rendre votre corps comme:

<body>
<table>
   <thead><tr><td>Your header goes here</td></tr></thead>
   <tfoot><tr><td>Your footer goes here</td></tr></tfoot>
   <tbody>
     <tr><td>
     Page body in here -- as long as it needs to be
     </td></tr>
   </tbody>
</table>
</body>

Oui, il n'est pas bon (tables vs CSS), ce n'est pas idéal, mais (surtout pour vous) il ne fonctionne pas sur IE6. Je ne peux pas commenter sur Firefox que je n'ai pas testé, mais ça devrait faire l'affaire. Cela permettra également de gérer différentes pages de format, différentes tailles de police, etc. donc, il faut "juste travail".

Si vous voulez l'en-tête et pied de page apparaissent sur les médias imprimés, puis utiliser le @media paramètres à faire la bonne chose:

@media print {
    thead { display: table-header-group; }
    tfoot { display: table-footer-group; }
}
@media screen {
    thead { display: none; }
    tfoot { display: none; }
}

6voto

UpTheCreek Points 7719

Cela fonctionnera dans certains navigateurs, pas tous. Je ne pense pas qu'il existe une solution élégante multi-navigateur

Incluez le pied / en-tête d'impression souhaité dans les divs de la page (dans cet exemple, div id = 'printableFooter')

Dans le fichier d'écran CSS, mettez:

 #printableFooter {display: none;}
 

Dans le fichier print css:

 #printableFooter {display: block; position: fixed; bottom: 0;}
 

5voto

Sachin Chourasiya Points 2542

Je suggérerais de diviser la page en tableau et d'ajouter l'en-tête à la première ligne et le bas de page à la dernière. Le contenu des lignes entre la première et la dernière ligne peut être modifié de manière dynamique afin que vous obteniez l'en-tête et le pied de page constants aux pages souhaitées.

 ----------
ROW1    HEADER
----------
ROW2   
 Insert dynamic contents here
ROW N-1
----------
ROW N Footer
 


3voto

Horacio N. Hdez. Points 351

essayer de générer un document (rtf | pdf) pour impression

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X