Foros del Web » Creando para Internet » CSS »

Crear versión reducida con CSS

Estas en el tema de Crear versión reducida con CSS en el foro de CSS en Foros del Web. Hola! Tengo una página que necesito que mis clientes puedan imprimir... Para que se ajuste a tamaño folio, tiene que estar al 65% (lo compruebo ...
  #1 (permalink)  
Antiguo 04/03/2011, 03:00
 
Fecha de Ingreso: enero-2011
Mensajes: 84
Antigüedad: 6 años, 10 meses
Puntos: 4
Crear versión reducida con CSS

Hola! Tengo una página que necesito que mis clientes puedan imprimir...

Para que se ajuste a tamaño folio, tiene que estar al 65% (lo compruebo poniendo vista previa para imprimir en IE) y quisiera poder hacer que mi página siempre estuviera al 65% cuando le den a imprimir independientemente de que el navegador la reduzca al imprimir o no. He leido que con css "media=print" o algo así se puede hacer...

¿alguien me puede ayudar por favor?

La misma página, reducida al 65% cuando le den al boton imprimir...

muchas gracias de antemano!
  #2 (permalink)  
Antiguo 05/03/2011, 00:21
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Crear versión reducida con CSS

hola nachetee:
Debes crear una hoja de estilos alternativa y llamarla en el head de tu documento html con el siguiente código:

Código HTML:
Ver original
  1. <link rel="stylesheet" type="text/css"  media="print" href="tu_hoja_de_estilos_alternativa.css">

En esta hoja de estilos puedes hacer todos los cambios que quieras que estos no modificaran el aspecto de tu sitio web sino que solo se verán al momento de imprimirse el documento.

Saludos.
  #3 (permalink)  
Antiguo 07/03/2011, 02:38
 
Fecha de Ingreso: enero-2011
Mensajes: 84
Antigüedad: 6 años, 10 meses
Puntos: 4
Respuesta: Crear versión reducida con CSS

Muchas gracias!

Pero en esa hoja de estilos nueva alternativa, como le digo que lo que tiene ke hacer al imprimir es que lo reduzca todo el 65%? hay alguna forma?
  #4 (permalink)  
Antiguo 07/03/2011, 04:58
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Crear versión reducida con CSS

hola nachetee, si, en realidad es mucho más sencillo de lo que parece, mira, supongamos que tenes este titulo
<h1>titulo</h1>

luego creas dos hojas de estilos
en la 1ra, llamemosla 'estilos.css' escribes:
h1{color:red;}

y en la 2da, llamemosla 'deimpresion.css' escribes:
h1{color:blue;}

luego llamas a las dos hojas de estilos en el head:

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

Esto hará que tu título se imprima de color azul y se presente en color rojo para todos los demás medios visuales.

Esto trasladalo a cualquier cosa, ejemplo tu contenedor, si cambias el width para impresión pues cambiará y se imprimirá con otro ancho.

Cabe aclarar que esto:
<link rel="stylesheet" type="text/css" href="estilos.css">
será tomado por todos los medios visuales ya que no le declaramos el atributo media. Esto otro funciona de igual forma:
<link rel="stylesheet" type="text/css" media="all" href="estilos.css">

En tal caso que desees que esa hoja de estilos se vea solo en pantalla agregas media="screen"

y asi con los demás medios.

Espero te sea útil, un saludo.

Etiquetas: versiones
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:16.