Css para imprimir

joselichu007

Buenas, haber si me podéis echar una mano. Tengo que hacer un curriculum en XHTML con dos hojas de estilo (una normal y otra para imprimir) pero con la de imprimir tengo el problema de que no me muestra las imágenes background de la css...he estado buscando por internet y solo encuentro la solución de cambiar la configuración en el navegador, sabéis si hay alguna forma que no sea esa??

Muchas Gracias!

NeB1

#1 para imprimir los backgrounds no. Siempre he tenido problema con eso... Lo único que puedes hacer es poner una imagen en una Capa con <img> y que esa capa tenga un z-index:0px; despues por encima pones todo lo demás.

es decir

<!--Esta capa simularia un background, pero al ser una etiqueta <img> se verá obligado a imprimirse-->
<div style="position:absolute;width:1024px;height:800px;left:0px;top:0px;z-index:0;">
    <img src="./laImagenDeBackground.png">
</div>
<!--Esta capa sería el resto de la web-->
<div style="position:absolute;width:1024px;height:800px;left:0px;top:0px;z-index:99;">
    <label>Nombre:</label>
     Pepe
    <label>Estudios:</label>
    e HeStuDiaDo Pa ReShuLo PuTiCaS
</div>

Evidentemente los tamaños son inventados. Te aviso de que cada navegador interpreta los Css a la hora de imprimir de un modo bastante distinto, almenos esa experiencia he tenido yo, aún peor que simplemente hacer la web para varios navegadores.

En IE7 veía la web bien, pero al intentar imprimirla se descolocaba toda completamente. Aunque si estás haciendo un css aposta para imprimir doy por hecho que ya lo sabes.

Espero haberte ayudado en algo.

joselichu007

Muchisimas gracias tio!!!, ya lo he hecho poniendo los estilos en su hoja y el html en el otro lado y me ha quedado perfecto, muchas gracias tio...
Una par de cosillas mas, para que sirve z-index q ese no lo conocia y la otra que como ahora he puesto la imagen desde html y no css cuando cargo la css de imprimir me sale la foto a color y no en blanco y negro como tenia antes (antes tenia 2 fotos iguales una a color y otra en blanco y negro, y cada css cargaba una) alguna idea de como cambiarlo...levo intentandolo 1 rato y nada, pero wueno seguire en ello jeje

Venga muchas gracias tio!

NeB1

como sabes cuando se usa el css para imprimir, mediante php, javascript o alguna tecnica css? (según esto te diré una solución a lo de la foto en blanco y negro).

El z-index indica que está más al fono en una web. Los valores más altos se sobreponen a los más pequeños.

joselichu007

A...no sabia eso pues es bastante ultil jejeje, pues lo hago desde html con:

spoiler

Osea q cuando doy a vista previa en el navegador pues me carga la hoja de estilos1 y en normla me carga la normal.....una cosa para ajustar la imagen he usado width:***pt; y
height: ***pt; pero le da un poco igual no me cambia el tamaño....esque en la hoja normal me queda bien...pero en la otra me queda enorme no se porq....xD

joselichu007

Lo del tamaño ya lo he apañado...lo del color todavía no.....

NeB1

Solo se me ocurre un botón que ponga "imprimir" así:

<input type="button" value="imprimir" onclick="document.getElementById('ID_DE_LA_IMAGEN').src='DIRECCION_IMAGEN_BLANCO_I_NEGRO'; window.print();">

Y para que funcionase al campo <img> tienes que añadirle un campo ID que será el que pondrás en ID_DE_LA_IMAGEN, p.e:

<img id="fondo" src="./img/fondo_color.jpg">
<input type="button" value="imprimir" onclick="document.getElementById('fondo').src='./img/fondo_blanco_negro.jpg'; window.print();">
joselichu007

Al final lo envie con la foto en color, pero bueno creo que al final me ha quedado todo bastante bien, muchas gracias x todo!!!, x cierto no sabras de alguna pagina con imagenes para los menus y todas esas movidas que tengo q hacer la pagina index de mi web y la quiero dejar "bonita" xD
Muchas gracias x todo, 1 abrazo!!

NeB1

Te recomiendo que busques en google "free css dropdown menu" y verás la cantidad de menús preciosos ya hechos de todas las formas imaginables.

Bueno he dado por sentado que querías ese tipo de menús. Si nos puedes mirar en esta web que he hecho esta semana y si te gusta o bien el menu superior o el de la derecha te puedo pasar el código.
http://jordi.nosdom.com/seguris/seguros.php.

Nada, un placer ayudarte!
Cuando tengas más dudas ya sabes donde estamos.

joselichu007

Pues si me lo pudes pasar me harias un favor tio, x cierto la pagina ta genial.....haber si puedo conseguir yo un index aceptable....xD xD

Usuarios habituales

  • joselichu007
  • NeB1