En-têtes de page CSS - comment utiliser les marges d'impression?

Je peux obtenir un en-tête à imprimer sur chaque page, mais je suis nouveau pour imprimer des marges. Je pensais que @page css fonctionnerait, mais cela ne semble pas affecter les marges de la page. Si je définis les marges sur le corps, cela fonctionne sur la première page, mais les pages suivantes démarrent la marge supérieure à la valeur par défaut, en plaçant l'en-tête au-dessus du texte.En-têtes de page CSS - comment utiliser les marges d'impression?

<style> 
.header { 
position: fixed; 
top: 0; 
} 
@page { 
size: 11in 17in; 
margin-left: 1in; 
margin-right: 1in; 
margin-top: 1in; 
margin-bottom: 1in; 
} 
</style> 

<body> 
<span class=header>This is the header</span> 
This is the text of the document. (repeat until I get to page 2) 
</body>

Source

2010-12-03 Ted Scheckler

Le support de '@ page' est notoirement peu fiable. Quels navigateurs avez-vous essayé? –

support d'impression par tous les navigateurs est très mal pris en charge avec des bugs horribles dans de nombreux navigateurs qui ont disparu depuis des années non fixé.

La réponse courte est d'éviter l'impression HTML/CSS si vous devez vous assurer d'une mise en page spécifique. Utilisez PDF, éventuellement généré dynamiquement à la demande. Il existe diverses API de générateur PDF, telles que iTextSharp. Il est possible d'imprimer à partir de Flash, mais seulement si Flash est installé et fonctionne (c'est-à-dire pas de Flashblock, iOS).

L'impression HTML/CSS doit être limitée aux mises en page simples. L'impression de formulaires est un cauchemar avec fieldset & legend le support étant particulièrement problématique (particulièrement sur Firefox). Le support d'impression intéressant est le meilleur sur les explorateurs d'Internet.

La spécification de support d'impression CSS3 n'a pas été terminée et il y a un temps de repos.

Principes généraux:

Aucun arrière-plans ou images CSS d'arrière-plan sont pris en charge (par défaut - les utilisateurs peuvent modifier leurs paramètres de votre navigateur pour une application intranet). Seules les images d'avant-plan s'impriment.
Les largeurs doivent être fluides car les tailles de page varient autour de la planète. Le format Lettre US est plus court et plus large que le format A4
Tous les navigateurs prennent en charge l'impression de différentes manières. Les bugs sont légion.
Test utilisant un aperçu avant impression.

Source

2010-12-29 07:13:41 GlennG

Cette réponse a trois ans mais j'ai le même problème. Est-ce que le support de css d'impression s'est amélioré entre-temps? Plus précisément, http://stackoverflow.com/questions/18173423/css-print-stylesheet-padding-on-the-second-page/18173467?noredirect=1#18173467 – Heraldmonkey

Non, la position est toujours la même. –

La réponse acceptée qui est maintenant 4 1/2 ans dit:

« La réponse courte est d'éviter l'impression HTML/CSS si vous devez vous assurer une mise en page spécifique. »

Aujourd'hui, vous pouvez imprimer HTML/CSS pour des mises en page relativement simples dans les navigateurs ou si vous utilisez un outil comme wkhtmltopdf vous pouvez opter pour des mises en page plus complexes. Voir aussi http://www.toccon.com/toc2013/public/schedule/detail/26714

Source

2015-07-28 09:33:38

En-têtes de page CSS - comment utiliser les marges d'impression?

Répondre

Questions connexes