miércoles, 4 de octubre de 2006

CSS para imprimir

Al respecto del artículo "Informes html en Velneo" han surgido ciertas dudas sobre el uso de css para controlar la impresión de documentos ( tamaño del papel, márgenes, cabecera, pie de página, etc...).

Con el uso de css podemos definir todo ello.

Cuando definimos el css para un sitio web normalmente ponemos

[link href="general.css" rel="stylesheet" type="text/css" /]

pero no olvidemos que existe el selector media.

Con este selector podemos definir el css de un sitio así

[link href="impresion.css" media="print" rel="stylesheet" type="text/css" /]
[link href="general.css" media="screen" rel="stylesheet" type="text/css" /]

con lo cual cuando nuestro documento se vea en pantalla se aplicará el estilo marcado como media="screen", y cuando estemos imprimiendo nuestro documento se estará aplicando el estilo media="print".

Definiendo nuestras reglas css así

@media print [
H1 [ font-size: 10pt ]
]
@media screen [
H1 [ font-size: 12pt ]
]

estamos definiendo un estilo para pantalla y otro para impresión, en este caso cambiando el tamaño de la fuente de los titulares de nivel 1.

Podemos ocultar elementos en cualquiera de los dos casos para que se muestren en la versión en pantalla pero no en la versión impresa y viceversa.

{ visibility: hidden }

Y por ejemplo si queremos insertar saltos depágina controlados en html podemos usar la propiedad page-break.

Si insertamos un

[div style="page-break-after:always"][/div]

en nuestro documento estaremos forzando un salto de página tras este elemento.

He comentado los media print y screen, pero existen muchos otros como aural ( para lectores de voz sintética que te leen la pantalla cuando tienes problemas para visualizarla ), o braille ( cuando lees la pantalla en braille ), handheld ( para dispositivos con pantallas pequeñas o limitaciones de color o ancho de banda ), projection, tty, tv, etc.

Si quereis profundizar más sobre el tema os recomiendo w3c, la página del World Wide Web Consortium en español donde podreis consultar y estudiar las recomendaciones, tendencias y estandares sobre la web que viene.

Tened en cuenta lo siguiente; las normas de cómo es la web no las dicta ningún fabricante de navegadores de internet, las dicta un consorcio internacional de expertos, w3c.

Los fabricantes de navegadores lo que deberían hacer es atenerse a las reglas y hacer que sus navegadores sigan los estándares de w3c, cosa que ninguno de ellos cumple al 100%, pero hacia ahí vamos.

Así que no desarrolleis webs para que se vea bién con este u otro navegador, desarrollad webs que cumplan los estándares y si no se ve bién con el navegador de turno, que se actualice o muera, porque yo personalmente me cambiaría a otro navegador que sí cumpla los estándares.

No hay comentarios:

Publicar un comentario