Foros del Web » Creando para Internet » CSS »

div con imagen

Estas en el tema de div con imagen en el foro de CSS en Foros del Web. hola amigos tengo un problemita, quiero poner una capa con una parte de la imagen de un pergamino que se repita en Y, tengo esto ...
  #1 (permalink)  
Antiguo 23/07/2009, 17:21
Avatar de baxi2990  
Fecha de Ingreso: agosto-2008
Ubicación: Quetzaltenango - Guatemala
Mensajes: 340
Antigüedad: 9 años, 3 meses
Puntos: 2
div con imagen

hola amigos tengo un problemita, quiero poner una capa con una parte de la imagen de un pergamino que se repita en Y, tengo esto pero se ve de lo mas feo

Código:
#lateral-d{ background:url(images/right_top.gif) repeat-y; height:500px; width:250px; margin-left:10px; margin-right:10px; padding-top::20px; float:right;}
la imagen, es como la parte superior de esta

http://www.osmtj.org/Secciones/Infor...ino_chinon.jpg

la idea es que no e vea cuando se repite la imagen agradesco la ayuda.
  #2 (permalink)  
Antiguo 23/07/2009, 17:56
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: div con imagen

Cita:
la idea es que no se vea cuando se repite la imagen agradesco la ayuda.
¿podrías explicar mejor qué es lo que quieres hacer?
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #3 (permalink)  
Antiguo 24/07/2009, 09:47
Avatar de baxi2990  
Fecha de Ingreso: agosto-2008
Ubicación: Quetzaltenango - Guatemala
Mensajes: 340
Antigüedad: 9 años, 3 meses
Puntos: 2
Respuesta: div con imagen

Mi imagen, la que repito en Y es esta

http://s3.subirimagenes.com:81/priva...88righttop.gif

el resultado es este

http://s3.subirimagenes.com:81/priva...89lateral1.jpg

mi pregunta es, si hay alguna forma de que se mire como esta imagen que encontre

http://s3.subirimagenes.com:81/priva...70301logro.jpg

sin que se vea como se repite la imagen agradesco la ayuda.
  #4 (permalink)  
Antiguo 24/07/2009, 11:04
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: div con imagen

Mira a ver si en este ejemplo ves cómo hacerlo. La imagen del cuerpo central está hecha a la carrera y sin cuidar los detalles, por eso la parte derecha hace algo de feo. Pero eso es una cuestión de diseño gráfico, no de css.
Código html:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
  3. <title>Kseso? jugando con css </title>
  4. <meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />
  5. <style type="text/css">
  6. * {margin:0;padding:0; border:0; outline:none; position: relative;}
  7.  
  8. #contenedor{
  9. width:250px;
  10. margin: 0 auto;
  11. background: url(http://s3.subirimagenes.com:81/privadas/previo/thump_570288righttop.gif) no-repeat;
  12. overflow: hidden;
  13. }
  14.  
  15. #header {
  16. width: 100%;
  17. height: 25px;
  18. background: url(http://s3.subirimagenes.com:81/privadas/previo/thump_570288righttop.gif) no-repeat;
  19. font-size: 1.4em;
  20. color: #030;
  21. text-transform: uppercase;
  22. font-family: serif;
  23. text-align: center;
  24. }
  25. #cuerpo{
  26. background: url(http://img43.imageshack.us/img43/6701/cuerpoc.jpg) repeat-y;
  27. padding: 0 5px;
  28. }
  29. #cuerpo p {
  30. font-size: 1.2em
  31. font-family: san-serif;
  32. color: #600;
  33. }
  34. #pie {
  35. background: url(http://img32.imageshack.us/img32/6260/piewxg.jpg) no-repeat;
  36. height: 25px;
  37. font-size: 1em
  38. font-family: san-serif;
  39. color: #300;
  40. text-align: right;
  41. padding-top: 7px;
  42. }
  43. </head>
  44. <div id="contenedor">
  45. <div id="header">
  46. hola mundo
  47. </div>
  48. <div id="cuerpo">
  49. <p>el contenido del cuerpo se aloja aquí, podría ser sólo texto o contener alguna imagen</p>
  50. <p> bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
  51. <p>Añadir más texto</p>
  52. </div>
  53. <div id="pie">
  54. Fin
  55. </div>
  56. </div>
  57. </body>
  58. </html>

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #5 (permalink)  
Antiguo 24/07/2009, 11:22
Avatar de baxi2990  
Fecha de Ingreso: agosto-2008
Ubicación: Quetzaltenango - Guatemala
Mensajes: 340
Antigüedad: 9 años, 3 meses
Puntos: 2
Respuesta: div con imagen

Exactamente lo que queria, agradesco tu ayuda kseso?
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 03:20.