Foros del Web » Creando para Internet » CSS »

Auto escalar imagen fondo web

Estas en el tema de Auto escalar imagen fondo web en el foro de CSS en Foros del Web. Hola, recientemente he encontrado un código css que me permite poner una imagen de fondo y que esta se adecue al tamaño de la ventana ...
  #1 (permalink)  
Antiguo 22/11/2011, 11:00
 
Fecha de Ingreso: enero-2008
Mensajes: 59
Antigüedad: 16 años, 2 meses
Puntos: 0
Auto escalar imagen fondo web

Hola, recientemente he encontrado un código css que me permite poner una imagen de fondo y que esta se adecue al tamaño de la ventana del navegador:

http://www.cssplay.co.uk/layouts/background.html

El problema es que estéticamente no me gusta nada que pierda las proporciones la imagen, me gustaría que mantuviera las proporciones.

He encontrado una web que lo hace, escala la imagen pero mantiene las proporciones, y a demás llega a un punto que también no deja que la imagen se aga mas pequeña cosa que también me parece muy interesante.

http://www.fluttuo.com/page_home.html

Lo de el cambio de imagen no me interesa, lo de escalado sin perder las proporciones y que haya un tamaño mínimo si, he estado mirándome el código fuente y creo que lo hace mediante css, pero no consigo reproducir ninguno de lso dos efectos.

Alguna idea de como hacerlo partiendo del código de la primera pagina?

Gracias de antemano!
  #2 (permalink)  
Antiguo 22/11/2011, 13:58
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Auto escalar imagen fondo web

se hace con la propiedad min-width
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}
  #3 (permalink)  
Antiguo 22/11/2011, 17:10
Avatar de Tedel  
Fecha de Ingreso: enero-2011
Ubicación: Lima
Mensajes: 2.744
Antigüedad: 13 años, 3 meses
Puntos: 444
Respuesta: Auto escalar imagen fondo web

Esto es básico, viejo:

1. Busca una imagen de 1920 píxeles de ancho (la máxima resolución de pantalla hasta el momento)
2. Background image = 100%
3. Graba y actualiza.
__________________
Soy el autor de Heptagrama y tengo un servicio "todo incluido" de marketing web.
  #4 (permalink)  
Antiguo 22/11/2011, 17:39
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Auto escalar imagen fondo web

Cita:
Iniciado por Tedel Ver Mensaje
Esto es básico, viejo:

1. Busca una imagen de 1920 píxeles de ancho (la máxima resolución de pantalla hasta el momento)
2. Background image = 100%
3. Graba y actualiza.
como??

para no dejarlo a medias
Cita:
html {
display: block;
}

body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}

#fondo {
position: absolute;
left: 0;
top: 0;
width: 100%;
min-width: 700px;
z-index: -1;
}


<img id="fondo" src="fondos" alt="" />
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}

Última edición por IsaBelM; 22/11/2011 a las 17:44
  #5 (permalink)  
Antiguo 23/11/2011, 03:17
 
Fecha de Ingreso: enero-2008
Mensajes: 59
Antigüedad: 16 años, 2 meses
Puntos: 0
Respuesta: Auto escalar imagen fondo web

Gracias era justo el efecto que quería lograr.
  #6 (permalink)  
Antiguo 23/11/2011, 10:26
 
Fecha de Ingreso: noviembre-2011
Mensajes: 1
Antigüedad: 12 años, 4 meses
Puntos: 0
Respuesta: Auto escalar imagen fondo web

?Esto es una prueba

Etiquetas: auto, escalar, html, tamaño
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 20:28.