Autoampliar imagen de fondo en capa div
las capas div me esta liando pues quiero meter en cuerpo una div con fondo y a la vez me gustaria que a la hora de meter texto esta se vaya ampliando con la imagen de fondo.
aqui dejo una imagen de lo que quiero hacer realmente imagen
aqui dejo una imagen de lo que quiero hacer realmente imagen
<body> <div id="wrapper"> <div id="head"> <div id="logo"><a href="<?php echo $row_DatosSharon['url']; ?>"><img src="skins/defalult/img/image/logosharon.png" width="430" height="258" /></a></div> <div id="menu"><nav id="navigation"> <ul> <li><a href="index.php">Home</a></li> <li><a href="#">Biography</a></li> <li><a href="#">Gallery</a></li> <li><a href="#">Works</a></li> <li><a href="#">Contact</a></li> </ul> </nav></div> </div> <div id="cuerpo"> <div id="contenido"> <table width="120%" height="534" border="0" align="center"> <tr> <td width="70%" height="424"><div id="fondo"><img src="skins/defalult/img/image/fondo-amplio2.png" width="229" height="61" /></div></td> <td width="14%"><div id="img-logo"> <img src="skins/defalult/img/image/bio-sharon.png" width="146" height="88" /> <div id="text-bio"> <address> Sharon A. Jensen </address> <address> Original Graphite Artist </address> <address> Hertfordshire, England </address> </div> <address> </address> <p> </p> <p> </p> <p><img src="skins/defalult/img/image/flag.png" width="141" height="99" /></p> </div></td> <td width="16%"> </td> </tr> <tr> <td height="102"> </td> <td> </td> <td><div id="company"> <p><img src="skins/defalult/img/image/logo.jpg" /></p> <p>Company</p> </div></td> </tr> </table> </div> </div> <div id="footer"> <div id="creditos"> <?php echo $nombreWeb ?> © 2013 | Home | Biography | Gallery | Works | Contact </div> </div> </div> </body> </html>
0
Puntos
Puntos
1701
Visitas
Visitas
7
Resp
Resp
Por graficaslucero hace 126 meses
Principiante
Respuesta #1
ah entiendo tu quieres ampliar la imagen hacia abajo según el texto se vaya incrementando pero claro de ser así la imagen se deformaría y perdería calidad de pixeles obviamente. lo mas sano es que utilices un fondo tipo textura como por ejemplo esta
solo tendrías que ponerla en el css de la capa mas o menos así
solo tendrías que ponerla en el css de la capa mas o menos así
#id_div {
background:url(2563337-textura-gris.jpg) repeat;
}
Respuesta #2
okey bueno pues lo que hare es que con fotoshop mismo le metere el texto en esa imagen y la acoplare ahi no me queda otra opcion. tu puedes decirme algun sitio donde pueda informarme bien de temas de css algun tuto o algo ando un poco perdido con el tema de position:
0
Puntos
Puntos
Por graficaslucero hace 126 meses
Principiante
Respuesta #3
Hola graficaslucer,
No se si ya has solucionado el problema, pero por si acaso te dejo la solución.
Basta con que le indiques en el css la siguiente propiedad:
background-attachment: fixed;
y si lo haces directamente en el div, <background="Aqui va la imagen" style ="background-attachment: fixed"
Pruebalo y me cuentas. Espero haberte ayudado.
No se si ya has solucionado el problema, pero por si acaso te dejo la solución.
Basta con que le indiques en el css la siguiente propiedad:
background-attachment: fixed;
y si lo haces directamente en el div, <background="Aqui va la imagen" style ="background-attachment: fixed"
Pruebalo y me cuentas. Espero haberte ayudado.
0
Puntos
Puntos
Por Irmerov hace 126 meses
Principiante
Respuesta #4
muchisimas graciasssss
probare si funciona pero dime se distorciona la imagen?
probare si funciona pero dime se distorciona la imagen?
0
Puntos
Puntos
Por graficaslucero hace 126 meses
Principiante
Respuesta #5
Que va! Queda la imagen tal cual.
0
Puntos
Puntos
Por Irmerov hace 126 meses
Principiante
Respuesta #6
haber la imagen la tengo que poner de fondo en una tabla y tengo que ponerle el background-attachment: fixed; o puedo ponerlo directamente? ejemplo
#fondo{
background-imagen: blablabla
background-attachment: fixed;
}
creo que le meti malamente el style donde lo tengo que poner exactamente? siempre me equivoco en esto soy torpon lo siento y ademas muchisimas gracias por vuestra ayuda.......
<div id="contenido" style ="background-attachment: fixed">
<table width="86%" height="650" border="1">
<tr>
<td width="985" height="644"><img src="skins/defalult/img/image/fondo-amplio2.png" width="825" height="512" />
#fondo{
background-imagen: blablabla
background-attachment: fixed;
}
creo que le meti malamente el style donde lo tengo que poner exactamente? siempre me equivoco en esto soy torpon lo siento y ademas muchisimas gracias por vuestra ayuda.......
<div id="contenido" style ="background-attachment: fixed">
<table width="86%" height="650" border="1">
<tr>
<td width="985" height="644"><img src="skins/defalult/img/image/fondo-amplio2.png" width="825" height="512" />
0
Puntos
Puntos
Por graficaslucero hace 126 meses
Principiante
Respuesta #7
El backgorund-attachment:fixed va en el mismo CSS donde está la imagen que tienes como fondo. Que me parece que es el div llamado fondo. Es decir..
#fondo {
background-attachment: fixed;
}
Ahora, creo que podrías hacer esto también y creo que conseguirías buen resultado
#fondo {
background: url(colores.jpg) fixed;
width: auto;
height: auto;
display: inline-block;
}
#div_interior {
width: auto;
height: auto;
overflow: hidden;
}
Y todo lo que quieras colocar de contenido lo colocas dentro de ese div. 
