Estilos de impresión CSS

Con los estilos de impresión en CSS podemos optimizar la apariencia de un sitio web cuando el usuario lo imprime. La regla @media print permite aplicar estilos específicos para impresión, como ocultar elementos innecesarios o ajustar tamaños de fuente.

Estilos básicos de impresión

Las reglas definidas dentro de un bloque @media print solo se aplican al imprimir el documento. Esto es útil para ocultar menús, anuncios o pies de página en la versión impresa.

En este ejemplo, los elementos de navegación y pie de página no aparecen en la impresión, y el texto se muestra en negro con mayor tamaño.

Tamaño de página y saltos

Las reglas de impresión en CSS permiten definir tamaños de página y márgenes con @page, así como insertar saltos (page-break) para organizar mejor el contenido.

En este ejemplo, el margen de página se fija en 2 cm y cada nuevo encabezado de capítulo comienza en una nueva página.

Consejos para estilos de impresión

Al diseñar estilos de impresión es importante que el contenido sea legible y solo se impriman los elementos necesarios.

• Elimina menús, anuncios y otros elementos irrelevantes de la vista de impresión.
• Usa colores con buen contraste y tamaños de fuente adecuados para mejorar la legibilidad.
• Agrega saltos de página lógicos, por ejemplo antes de cada capítulo.