Vista Previa de Impresion

zyon · #1 (**permalink**) 03/03/2009, 16:07

Tengo una mega Duda!! hice un archivo html con un campo div con un tamaño especifico y Editable, el texto que contine lo ajusto para que se vae justificado y bueno, lo ajusto segun lo necesito, el caso es que cuando lo mando a vista previa antes de imprimir parece que me hace ese campo DIV mas chico y me mueve el contenido del texto y si mi parrafo tenia 5 lineas, ahora muestra 6 lineas, la 6ta linea es solo una palabra que se dajusta por que los espacios varian o no se, entonces siento que si se modifica el tamaño del div en la vista previa, espero me entiendan! alguien sabe por que o como lograr q se respeten los tamaños asignados?

Gracias de Antemano!!

David · #2 (**permalink**) 03/03/2009, 19:44

Es que para imprimir un documento HTML, suelen cambiar algunas cosas.

Lo que podría sugerirte es usar una hoja de estilos (CSS) prepara para aplicarse cuando se imprima el documento (media="print") en la que ajustas los tamaños de las fuentes y eliminas elementos que no quieras imprimir.

Un poco de información al respecto:
http://sigt.net/archivo/plantillas-c...consejos.xhtml

zyon · #3 (**permalink**) 04/03/2009, 12:44

Hola gracias por tu respuesta pero la verdad no he utilizado mucho lo que es CSS, siempre pongo todo directo sobre los objetos ( aunque se que no deberia :S ), el caso es que no comprendo para que es el media="print" al mandar a llamar la hoja de estilo, ley un poco pero no capto su objetivo, podrian darme otra idea maso de que se trata? Gracias de antemano!

zyon · #4 (**permalink**) 04/03/2009, 14:28

Ya hice cuanto dios me dio a entender jeje, pero en realidad lo q mando a imprimir es algo muy simple, solo texto ... El caso es que el objeto q contiene este texto tiene un tama;o definido y al imprimir parece q lo reduce un poco ... Cambie los tama;os de px por pt, pero aun asi no ala, hace lo mismo, alguna otra usgerencia??

SPAWN3000 · #5 (**permalink**) 04/03/2009, 17:29

La cuestion es que siempre se crea un archivo css para la vista en pantalla y otro para impresión, por defecto esta el de pantalla:
Cual es el objetivo: las web traen un monton de graficos, formularios y colores y eso no va bien con la impresión que la mayoría de veces solo se requieren datos específicos...

Ej: para que imprimir todos los colores de fondo, o todos los controles de un formulario si en la impresión no se pueden ingresar datos dinámicos...asi mas o menos. Por ello debes crear dos hojas de estilo, y para imprimir usas una con el atributo (media="print")...

(media="print")
<link rel="stylesheet" href="imprimir.css" type="text/css" media="print" />
el archivo imprimir.css tiene menos colorido, imagenes...solo lo que se considera necesario...

En tu caso tu no desea que se vean los marcos del div, Solo la información...exactamente es en este archivo donde debes definir lo...

zyon · #6 (**permalink**) 04/03/2009, 18:33

Aun no entiendo para que es el atributo media="print", y si entendi bien dices que en el CSS debo definir el estilo de la pantalla que quiero imprimir indicando en la misma que objetos deberia desaparecer y caracteristicas q deberan tomar los que quiero que se inpriman, no? que diferencia habria si defino eso dentro del mismo html q mando a imprimir? y saben, de hecho lo que mando a imprimir es el contyenido de un html, es basicamente texto con formato unicamente, no tiene ni menus, ni opciones ni nada, perdon si paresco un cabezotas, pero es que si ando aturdido con eso ya :S De hecho ya use una hoja para asignarle tipo de letra y tamaño al Texto pero pues es el mismo resultado :S

zyon · #7 (**permalink**) 05/03/2009, 12:28

que hay implementando el media="print" me reduce aun mas lo que imprimo :S y mas me confunde, en la pagina se ve algo y en la vista previa lo pone como a la mitad del tamaño ... eso es normal? O sera acaso que la hoja de estilo marcada como media=print solo se aplica al momento de imprimir?

SPAWN3000 · #8 (**permalink**) 05/03/2009, 12:58

O sera acaso que la hoja de estilo marcada como media=print solo se aplica al momento de imprimir?

Exacto! esta propiedad es definida precisamente para la impresión... no podrás ver la diferencia en el navegador.

zyon · #9 (**permalink**) 05/03/2009, 14:41

Si ya veo, entonces como podre saber que lo que escribi en panalla saldra tal cual lo necesito, mi problema es que en el texto requiero ponerlo asi :

Desarrollo de Sofware Via Web a b c d e, etc,
Desarrollo de Sofware Java a b c d e, etc,
Desarrollo .Net a b c d e, etc,--------------------

Pero cuadno mando a imprimir me sale :

Desarrollo de Sofware Via Web a b c d e, etc,
Desarrollo de Sofware Java a b c d e, etc,
Desarrollo .Net a b c d e,etc,---------------

Por dar un ejemplito, se desajusta, hay un modo de ver como luce en impresion en el navegador?

SPAWN3000 · #10 (**permalink**) 05/03/2009, 15:37

Sipi, Mira un desarrollador web debería tener instalado en su maquina(entre otras cosas):

- Instalar Firefox y estos complementos que descargas desde la página oficial.

Importantes:
1. Firebug: Depurar errores(JAVA SCRIPT, CSS, HTML, DOM...)
2. Web Developer: (Este es el complemento que necesitas) Ver la pagina
en distintas resoluciones, deshabilitar cache(para notar los cambios sin problemas)...y entre estas opciones existe un menu llamado CSS(aqui puedes ver la información del estilo de una pagina pasando el mouse por encima de las zonas, ver el CSS, y 'Ver como se ve tu página en la impresión-no garantizo que tan preciso pueda ser... no he necesitado hacerlo, solo conozco la opción).

Pueden ser útiles:
4. YSlow: Verificar el rendimiento de peticiones(Get o POST, HEADERS, PUTS), nivel de validez de la web,(imprescindible si haces un desarrollo para grandes clientes y conocedores del área) etc.
3. Diccionario: ortográfico ingles y español(Si desarrollas en mas de un idioma)-para el editor.
4. Screengrab: Con esto envías un screenshot de la aplicación o como esta el avance y diseño web.
5. IETab: Visualizar tu página en Iexplorer y Firefox en el mismo navegador, Tambien deberias tener versiones portables de opera, safari, IE6, IE7, IE8...

Esto básicamente...espero te sea útil.

zyon · #11 (**permalink**) 06/03/2009, 09:29

Vaya, pues es algo que si quiero entrar a checar nunca esta de mas saber un poco de todo, por que realmente no entiendo eso jeje, pero lo revisare, ademas ya encontre el problema , basicamente era la Fuente! Cn la "Courier new" parece ser que tiene un tamaño fijo entonces no me mueve ya lo que veo en pantalla en relacion a la impresión y por ahora me siento aliviado! Pero aun asi divagare un poco mas sobre las fuentes y muchisimas gracias por los comentarios, aprendi varias cosas!!