2010-09-13 11 views
10

¿Cómo se obtiene compatibilidad de navegador cruzado en Imprimir? cualquier consejo para imprimir un archivo css para hacer que la impresión en papel sea idéntica a la de todos los navegadores.¿Cómo obtener la compatibilidad de navegador cruzado en Imprimir en la página de todos los navegadores?

Editar

ya estoy usando Eric Meyer CSS pero aún enfrenta inconsistencias en otro navegador cuando tomamos de impresión desde el sitio.

¿Hay alguna declaración de CSS que podamos usar siempre y poner en la parte superior de css impresos, como otros restablecimientos de css que funcionan bien en media=screen?

ya estoy usando un css diferente para impresión (print.css) con media="print"


¿Sería mejor mantener * {posotion:static}, *{float:none}, * {clear:both} de impresión CSS siempre?

Respuesta

17

Los resultados idénticos son imposibles. La salida no solo depende de CSS, sino también de las configuraciones individuales para los márgenes de página, las capacidades de la impresora, las fuentes disponibles, el formato de papel (A4 frente a US Letter) y probablemente mucho más.

Para CSS

  • Evitar flotadores y de posicionamiento (relativo, absoluto y fijo). Especialmente Mozilla (Firefox) no puede manejar esas propiedades muy bien.
  • Use page-break-* pero no confíe en ello. Algunos navegadores insertan saltos de página incluso en imágenes.
  • No conoce el ancho ni el alto de la página (podría A5). Mantenga todo lo más flexible posible.
  • For performance, ponga su estilo de impresión en la hoja de estilo principal en una regla @media print {}.
  • Use pt no px para bordes y márgenes. Una impresora no sabe qué es un píxel y puede obtener resultados extraños.
  • Desarrolle su diseño de impresión en Opera, que tiene el mejor soporte para @media print actualmente, e inserte hacks de compatibilidad, cuando haya terminado.
  • Internet Explorer puede bloquearse en la impresión, si usa su reserved IDs.
  • Nunca confíe en la vista previa de impresión. Obtienes resultados muy diferentes en impresiones reales. Guarde la selva tropical con un controlador de impresión en PDF. :)
+0

Gracias por todos los consejos. +1 para entender mi pregunta correctamente –

2

En html, utilice un enlace con el atributo "media" establecido en "imprimir".

<LINK rel="stylesheet" type"text/css" href="print.css" media="print"> 

Puede deshabilitar todos los demás CSS y simplemente usar su "impresión" CSS. establecer el medio primero en "pantalla". Pruébelo como si estuviera probando un CSS normal en todos los navegadores.

En mi experiencia, lo que se ve en la pantalla, se verá más o menos cuando se imprima.

Consejo:

1) Mantenga un diseño lo más fluido posible para que sea flexible para que sea la margen del papel se establece en.

2) mantenerlo simple.

3) En IE, es posible que falten fondos. Para solucionar esto, vaya a: Herramientas> Opciones de Internet> Avanzado. en el cuadro de diálogo Configuración, desplácese hacia abajo para Imprimir y active "Imprimir colores e imágenes de fondo"

+0

Gracias por la respuesta. Sé sobre print css y 'media =" print "' mi pregunta era diferente. incluso estoy usando el restablecimiento de CSS en el CSS principal pero enfrentando inconsistencias en la impresión –

+0

Bueno, eso es común ya que se trata de diferentes navegadores. Debe crear correcciones para cada uno, si es necesario. – sheeks06

Cuestiones relacionadas