Como ajustar imagen de fondo para q ocupe el 100% del navegador

YOMAR_II · #1 (**permalink**) 02/02/2007, 17:59

Buenas. Estoy creando mi primera web. hice una captura del escritorio para usarla como fondo de la web y la guarde en dos resoluciones: una a 800*600 y otra a 1024*768. el problema está en que ni una ni otra resolucion se adaptan al navegador, es más, si una funciona + o - bien en firefox, en el explorer la imagen se hace grande. No sé si me explico, lo que me gustaría es que se viese totalmente la imagen en una pieza, sin necesidad de usar la barra de desplazamiento vertical y/o horizontal. en la etiqueta <body> no se admite lo de wight ni height.

¿alguien sabe como hacerlo?

gracias

caricatos · #2 (**permalink**) 03/02/2007, 00:54

Hola YOMAR_II, bienvenido a los foros

:

Los fondos no se pueden estirar por ahora (tal vez en próximas versiones css se implemente)... y de este tema ya se ha hablado, y creo que la mejor opción sería poner como primer tag esa imagen y con estilos acomodarla:
<html>
<img id="estirada" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%" src="fondo.jpg" />


Saludos

Gurrutello · #3 (**permalink**) 03/02/2007, 01:15

Hola
Si quieres que ademas sea fondo ...
digamos fondo estirado no aprobado ... pro un truco
pon esto esto en el estilo (style) z-index:-50;
50 o menos es cuestion de probar.
Saludos

JavierB · #4 (**permalink**) 03/02/2007, 03:24

Hola a todos.

Este enlace puede ayudar: http://www.cssplay.co.uk/layouts/background.html

Saludos,

YOMAR_II · #5 (**permalink**) 03/02/2007, 08:40

GRACIAS X CONTESTAR.
hice lo que me dice Caricatos y la verdad, perfecto en firefox, pero en explorer parece q no hace caso( aparece un margen en blanco por debajo y a la derecha de la imagen)
lo que dice Gurrutello, no lo pude probar, xq aún no se de q va eso de los estilos, ni sé como se hace
lo de JavierB, es perfecto, pero no se q hay q hacer, abro esa página, se ve la imagen de un conejo ocupando el 100% del navegador, pero no me dice como se consigue ese efecto

caricatos · #6 (**permalink**) 03/02/2007, 09:25

Hola:

Sí... con explorer hay que hacer piruetas con los estilos (overflow: hidden; margin: 0) en el tag body... (no sé si habrá que controlar también el padding y el tag html...

Saludos

JavierB · #7 (**permalink**) 03/02/2007, 13:57

Cita:

Iniciado por YOMAR_II

lo de JavierB, es perfecto, pero no se q hay q hacer, abro esa página, se ve la imagen de un conejo ocupando el 100% del navegador, pero no me dice como se consigue ese efecto

Tienes que mirar el código fuente de la página. Ahí tienes el código Css.

Saludos,

jaruso · #8 (**permalink**) 13/04/2008, 04:05

Cita:

Iniciado por JavierB

Tienes que mirar el código fuente de la página. Ahí tienes el código Css.

Saludos,

Hola a tod@s!

Estoy interesado en conseguir el mismo efecto que YOMAR_II y viendo el código de la página del conejo, la imagen se me queda en grande pero no puedo escribir encima, osea que la imagen se inserta en grande pero no como fondo, ya que no puedo escribir nada encima....Alguien podría ayudarme?¿?

charleston · #9 (**permalink**) 19/03/2010, 12:22

Hola Estimados:

Es el 2010 y nunca quedo una respuesta clara para esta interrogante.

sucede que ahora los tiempos han cambiado tenemos muchas mas versiones de CSS y la llegada de nuevos programas como el Dreamweaver CS4.

actualmente estoy haciendo una web y se me presento este mismo problema y investigue como es de costumbre y donde mas que aqui en foros del Web...

y luego de quedar con gusto a poco con algunas respuestas de aqui, investigue mas y di con la solución

ante uds la posible solución:

http://www.w3c.es/divulgacion/guiasbreves/HojasEstilo (no pude volverlo link)

Probando:

Lo probe con una imagen de 1024x768, 1152x864,1080x1024,1360x768,1920x1080 y se ve perfecto, ocupa toda la pantalla

contras: Lo probre bajo la minima resolución: 800x600 y ahi tenemos problemas.. no ocupa toda la pantalla queda muy grande y ahi que acomodar la imagen con la barra espaciadora.

Posible solucion y interrogante: estoy pensanso probar con una imagen de 800 x 600 y de esa manera creo que quedaria adaptada al 100% en todas las resoluciones superiores.

les comentare mis resultados....
toda oponion comentario, sera bien recibido :)

saludos,

Charleston

JavierB · #10 (**permalink**) 19/03/2010, 12:27

Hola charleston

Te recuerdo el aviso que había al final de este tema y que pareceque no has leído o no le has hecho nicaso.

Tema cerrado.