Foros del Web » Creando para Internet » CSS »

problema background

Estas en el tema de problema background en el foro de CSS en Foros del Web. pues tengo un problema estoy usando una imagen como fondo del tamaño 1234 x 750 pero cuando coloco el estilo body.. el fondo no se ...
  #1 (permalink)  
Antiguo 21/06/2009, 23:59
 
Fecha de Ingreso: septiembre-2005
Mensajes: 52
Antigüedad: 12 años, 2 meses
Puntos: 0
Pregunta problema background

pues tengo un problema estoy usando una imagen como fondo del tamaño
1234 x 750

pero cuando coloco el estilo body.. el fondo no se ve como si fuera q tubiera un margen en cada lado aca les dejo una imagen

img193.imageshack.us/img193/9595/sinttulo1elz.jpg

estoy usando una resolucion de 1280 x 1024

pero quisiera q el background se pueda ver bien en diferentes resoluciones
  #2 (permalink)  
Antiguo 22/06/2009, 00:09
Avatar de MasterXNicoX  
Fecha de Ingreso: junio-2008
Ubicación: ../Arg/SanLuis.city
Mensajes: 943
Antigüedad: 9 años, 6 meses
Puntos: 28
Respuesta: problema background

Hola Crack, cómo estás?...

Fijate si agregando esta propiedad al Background de la división te queda bien:

body{background:url(fondo.gif) center;}

Avisá si te sirvió.

Un Abrazo ;)
__________________
Adivino del Foro y Admirador de Sabios
  #3 (permalink)  
Antiguo 22/06/2009, 14:20
 
Fecha de Ingreso: septiembre-2005
Mensajes: 52
Antigüedad: 12 años, 2 meses
Puntos: 0
Pregunta Respuesta: problema background

estas son las propiedades q tiene mi estilo body


body {
font-family: Arial, Helvetica, sans-serif;
background-image: url(img/FONDO.png);
background-position: bottom;
background-color: #82d9ec;
background-repeat: no-repeat;
background-attachment: fixed;
  #4 (permalink)  
Antiguo 23/06/2009, 02:12
Avatar de MasterXNicoX  
Fecha de Ingreso: junio-2008
Ubicación: ../Arg/SanLuis.city
Mensajes: 943
Antigüedad: 9 años, 6 meses
Puntos: 28
Respuesta: problema background

Probá de esta manera...

Cita:
body {
font-family: Arial, Helvetica, sans-serif;
background-image: url(img/FONDO.png) center;
background-position: bottom;
background-color: #82d9ec;
background-repeat: no-repeat;
background-attachment: fixed;
Avisame si funciona :)
__________________
Adivino del Foro y Admirador de Sabios
  #5 (permalink)  
Antiguo 23/06/2009, 06:03
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: problema background

Si tu sábana es más pequeña que tu cama y la colocas en el centro, ¿qué pasará?

En www.araudi.net tienes algún ejemplo de "fondo elástico"
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #6 (permalink)  
Antiguo 23/06/2009, 11:52
 
Fecha de Ingreso: septiembre-2005
Mensajes: 52
Antigüedad: 12 años, 2 meses
Puntos: 0
Pregunta Respuesta: problema background

lo subi para q vean el problema

allremix.com.ar
  #7 (permalink)  
Antiguo 23/06/2009, 13:31
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: problema background

Toma la solución que te dio Kseso?, es lo que necesitas.
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #8 (permalink)  
Antiguo 23/06/2009, 18:05
Avatar de MasterXNicoX  
Fecha de Ingreso: junio-2008
Ubicación: ../Arg/SanLuis.city
Mensajes: 943
Antigüedad: 9 años, 6 meses
Puntos: 28
Respuesta: problema background

Cita:
Iniciado por kseso? Ver Mensaje
Si tu sábana es más pequeña que tu cama y la colocas en el centro, ¿qué pasará?


--------------------------------------------------------------------------------------

Me voy a poner a ver lo de Fondo elástico jeje
__________________
Adivino del Foro y Admirador de Sabios
  #9 (permalink)  
Antiguo 11/07/2009, 10:46
Avatar de gabrielflowers  
Fecha de Ingreso: julio-2007
Ubicación: Santa Cruz de la Sierra
Mensajes: 187
Antigüedad: 10 años, 5 meses
Puntos: 3
De acuerdo Respuesta: problema background

crack16 este es mi humilde aporte a tu problema:

Código HTML:
<html>
<head>
<title>Imagen de fondo fullscreen</title>
<style>
body { margin: 0px; }
#fondoestirado 
{
    width: 100%;
    height: 100%;
	background:#00f;
    margin:0;
    border:0;
    padding:0;
}
#fondoestirado img 
{
    width: 100%;
    height: 100%;
}
#contenedorgeneral 
{
    z-index: 2;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
</style>
</head>

<body>
	<div id="fondoestirado"><img src="fondo1.jpg"></div>

   <div id="contenedorgeneral">
   		<br><br><br>
   		Cuerpo de la pagina
   		<br>
   		aca pongo lo que quiero, etiquetas html,etc
   		
   </div>
   
</body>
</html> 
uno de los pocos defectos q le encuentro es que si el contenido de la pagina es extenso y se genera el scroll la imagen no se estira, pruebalo y a ver si te sirve, yo probe el codigo de mikmoro tambien en varios navegadores, y en algunos no funciona bien, se q no es ineficiencia de parte de nosotros, sino la dificultad de generar codigo crossbrowser ante las diferencias funcionales de los navegadores,

espero te sirva, saludos
__________________
"puedo detenerme, pero no retroceder, tengo que avanzar..."
  #10 (permalink)  
Antiguo 11/07/2009, 14:55
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: problema background

Hola:

Cita:
Iniciado por gabrielflowers Ver Mensaje
yo probe el codigo de mikmoro tambien en varios navegadores, y en algunos no funciona bien
¿En cuáles lo probó? ó ¿En cuáles no funciona bien?

Saludos.

  #11 (permalink)  
Antiguo 11/07/2009, 16:23
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: problema background

Señor Gabrielflores:
¿tuvo usted la precaución de probar su código antes de ofrecerlo?
Especialmente si el html tiene el obligado doctype.
Hágalo antes de enjuiciar el de otros, y después nos explica para qué queremos las barras de scroll que aparecen (ff 3.5, ie7, Opera 9.64, chrome, safari 4, ie6 en ietester, corriendo en vi$ta)

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #12 (permalink)  
Antiguo 11/07/2009, 18:02
 
Fecha de Ingreso: diciembre-2008
Ubicación: Cordoba
Mensajes: 127
Antigüedad: 9 años
Puntos: 17
Respuesta: problema background

ietester no muestra resultados reales lo mejor es isntalar el vmware y emular windows xp sp2 con ie6. esta comprobado en sitios web reales.. mas info google
  #13 (permalink)  
Antiguo 13/07/2009, 09:48
Avatar de gabrielflowers  
Fecha de Ingreso: julio-2007
Ubicación: Santa Cruz de la Sierra
Mensajes: 187
Antigüedad: 10 años, 5 meses
Puntos: 3
Respuesta: problema background

hola
jomaruro probe el ejemplo de mikmoro(referenciado por kseso) en IE6,FF3,google CHROME, y para ser mas preciso aca te muestro algunas de las deficiencias q encontre:



y estimado kseso, no fue mi intencion desprestigiar mikmoro cuando hice mi intervencion(aunque veo q te afecta, debes ser su leal seguidor), solo que yo tambien buscaba como poner una imagen de fondo fullscreen, y probe justamente los ejemplos de mikmoro, y vi q tenia algunas pequeñas deficiencias, entre las q ya mencione,y dejame decirte que probe mi codigo antes de ofrecerlo.

lo del scroll creo q me entendio mal.

ptdta: no estoy enjuiciando a nadie, sino q tambien busco codigo crossbrowser, y estoy en ese afan, creo q de verdad pocos lo consiguen, como dije antes no es culpa de nosotros los diseñadores de web, sino de la diversidad de navegadores cada uno con su forma de interpretar codigo,etc

espero el amigo crack16 nos diga si alguno de nuestras sugerencias le sirvio, saludos
__________________
"puedo detenerme, pero no retroceder, tengo que avanzar..."
  #14 (permalink)  
Antiguo 13/07/2009, 10:13
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: problema background

Bueno, esta es la forma en que yo lo haría:

Código html:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <title>Untitled Document</title>
  5. <style type="text/css">
  6. html, body {margin:0; padding:0; width:100%; height:100%; overflow:hidden;}
  7. .imagen{position:absolute; z-index:1; width:100%; height:100%;}
  8. .contenido{ width:800px; height:300px; border:1px solid #333; margin:0 auto; position:relative; z-index:2}
  9. </head>
  10.  
  11. <div>
  12. <img class="imagen" src="Imagen de un apretón de manos, un blanco y un negro.jpg" />
  13. </div>
  14. <div class="contenido">
  15.     Aqui va el contenido
  16. </div>
  17. </body>
  18. </html>
__________________
WFC
codigo82
  #15 (permalink)  
Antiguo 14/07/2009, 14:34
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: problema background

Hola:

Cita:
Iniciado por gabrielflowers Ver Mensaje
hola
jomaruro probe el ejemplo de mikmoro(referenciado por kseso) en IE6,FF3,google CHROME, y para ser mas preciso aca te muestro algunas de las deficiencias q encontre:
De IE6 no te puedo decir nada, pero en FF 3.0.11 y en IE 7.0.5730.13, esos errores que mencionas, en mi PC (Windows XP SP3) no aparecen, lamento no poder poner ninguna imagen porque no dispongo de ningún programa con el que hacer una captura de pantalla. Tampoco podría decirte a que son debidas esas deficiencias que has encontrado.

Saludos.

  #16 (permalink)  
Antiguo 14/07/2009, 20:55
Avatar de anf
anf
 
Fecha de Ingreso: junio-2009
Mensajes: 30
Antigüedad: 8 años, 5 meses
Puntos: 4
Respuesta: problema background

Cita:
Iniciado por kseso? Ver Mensaje
Si tu sábana es más pequeña que tu cama y la colocas en el centro, ¿qué pasará?
Buenísimo el ejemplo
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 01:53.