2010-12-03 25 views
10

Puedo obtener un encabezado para imprimir en cada página, pero soy nuevo para imprimir los márgenes. Pensé que @page css funcionaría, pero no parece afectar los márgenes de página. Si configuro los márgenes en el cuerpo, funciona en la página uno, pero las páginas subsiguientes comienzan con el margen superior por defecto, colocando el encabezado sobre el texto.encabezados de página CSS: cómo usar los márgenes de impresión?

<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> 
+1

El soporte '@ page' es notoriamente poco fiable. ¿Qué navegadores intentaste? –

Respuesta

9

Soporte de impresión por todos los navegadores es muy escaso apoyo con errores terribles en muchos navegadores populares que han pasado no fijadas por años.

La respuesta corta es evitar la impresión de HTML/CSS si necesita garantizar un diseño específico. Use PDF, posiblemente generado dinámicamente a pedido. Hay varias API generador de PDF como iTextSharp. Es posible imprimir desde Flash, pero solo si Flash está instalado y funcionando (es decir, no tiene Flashblock, iOS).

La impresión HTML/CSS debe restringirse a diseños simples. La impresión de formularios es una pesadilla con fieldset & legend siendo la compatibilidad especialmente problemática (especialmente en Firefox). Curiosamente, el soporte de impresión es mejor para los exploradores de Internet.

La especificación del soporte de impresión CSS3 no se ha completado y tiene un tiempo de inactividad.

principios generales:

  • No se admiten los fondos o las imágenes de fondo de CSS (por defecto - los usuarios pueden cambiar su configuración del navegador para una aplicación de intranet). Solo se imprimen las imágenes en primer plano.

  • Los anchos deben ser fluidos ya que los tamaños de página varían alrededor del planeta. El formato de carta de EE. UU. Es más corto y más ancho que el formato A4

  • Todos los navegadores admiten la impresión de diferentes maneras. Los insectos son legión.

  • Prueba utilizando la vista previa de impresión.

+3

Esta respuesta tiene tres años pero estoy teniendo el mismo problema. ¿Ha mejorado el soporte de impresión css mientras tanto? Específicamente, http://stackoverflow.com/questions/18173423/css-print-stylesheet-padding-on-the-second-page/18173467?noredirect=1#18173467 – Heraldmonkey

+2

No, la posición sigue siendo muy parecida. –

1

La respuesta aceptada que ahora es de 4 1/2 años de edad dice:

"La respuesta corta es evitar la impresión de HTML/CSS si es necesario para asegurar un diseño específico."

En estos días puede hacer impresión HTML/CSS para diseños comparativamente simples en navegadores o si usa una herramienta como wkhtmltopdf puede optar por diseños más complejos. Consulte también http://www.toccon.com/toc2013/public/schedule/detail/26714

Cuestiones relacionadas