Las hojas de estilo o CSS son un excelente recurso para diseñadores web porque nos permite controlar todo el diseño y estructura que se muestra en el navegador, pero que pasa cuando esa pagina web la imprimimos?

Bien pues el CSS también nos puede ayudar para imprimir con estilo, que posibilidades nos brindan las plantillas css para impresion?

• Ocultar elementos con las barras laterales o banners que estorben el contenido real del sitio
• Cambiar tipos de letras definiendo una para el navegador y una para la impresión
• Ofrecerle a tu usuario una información clara tanto en la web como en papel

Como se hace?

CSS para navegador:

body{ font-size:15px; }

#header{background:black; color:#fff;}

#content .contenido{width:400px;color:#333;font-size:12px;}

#content .sidebar{width:200px;background:#333;color:#fff;font-size:12px;}

#footer{background:red; color:#fff;}

CSS para imprimir, ocultando la barra lateral (sidebar):

body{ font-size:15px; }

#header{background:black; color:#fff;}

#content .contenido{width:400px;color:#333;font-size:12px;}

#content .sidebar{width:200px;background:#333;color:#fff;font-size:12px;}

#footer{background:red; color:#fff;}

@media print{

#content .contenido{width:100%;}

#content .sidebar{display:none;}
}

Si les intereso el tema y quieren saber mas acerca de como usar las hojas de estilo para imprimir les recomiendo estos enlaces:

• Crear hojas de estilo optimizadas para imprimir (en ingles)
• CSS para imprimir paginas web
• Going to Print
• CSS Print Profile (Tabla de propiedades)