Formatos diferentes para imprimir usando CSS

Nos encontramos ante una tarea clásica en un sistema web. Necesitamos hacer una página que muestre los resultados de una consulta y que al mandarse a imprimir no muestre todo el formato que en el navegador es imprescindible, como lo son: colores, imágenes, contrastes, etc. En resumen: necesitamos que esa página tenga un formato al mostrarse y otro al imprimirse.

Para resolver esto (no se preocupen, ya hubo alguien que pensó en éste problema antes) existe una funcionalidad con hojas de estilo (CSS). Se puede hacer que "automágicamente" una página debidamente formateada con su hoja de estilo al mandar imprimir tome otra hoja de estilo que sobreescriba las propiedades anteriores.

En pocas palabras esto se puede lograr añadiendo algo como esto a nuestra página en cuestión. La hoja de estilo que queremos utilizar para cuando se mande a imprimir la página desde el navegador se debe incluir de una manera como esta:

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

Y para indicar de manera explicita la hoja de estilo que queremos utilizar para el navegador podemos utilizar algo como :

<link rel="stylesheet" href="screen.css" type="text/css" media="screen, projection" />

Y ¡listo! con eso debería de bastar, si quieren indagar un poco más en este tema les dejo un par de enlaces que incluso tienen ejemplos pácticos:

• Ejemplo 1
• Ejemplo 2

Espero les sea útil... 

¡Saludos javer@s y no javer@s!