veran hice una pagina:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Media</title>
<style type="text/css">
#apDiv1 {
position:absolute;
width:1128px;
height:548px;
z-index:2;
left: -1px;
top: 0px;
}
</style>
</head>
<style type="text/css">
* {
margin: 0;
padding: 0;
position: relative;
overflow: visible;
visibility: inherit;
}
html,body {
width: 100%;
height: 100%;
overflow: hidden;
}
.img_bg {
width: 100%;
height: 100%;
position: absolute;
z-index: 1;
}
.all {
overflow: auto;
left: 0;
opacity: 0.7;
top: 0;
z-index: 2;
background-color: #FFFFFF;
}
.cont {
background: #FFF;
-moz-opacity: 0.7;
filter: alpha(opacity = 70);
width: 80%;
margin: 0 auto;
}
</style>
<script>
function cargarImagen(){
ahora=new Date();
hora=ahora.getHours();
if(hora>=0 && hora<4){
imagen="/imagenes/medianoche.jpg";
}
if(hora>=4 && hora<9){
imagen="/imagenes/amanece.jpg";
}
if(hora>=9 && hora<12){
imagen="/imagenes/alba.jpg";
}
if(hora>=12 && hora<19){
imagen="/imagenes/tarde.jpg";
}
if(hora>=19 && hora<21){
imagen="/imagenes/crepusculo.jpg";
}
if(hora>=21 && hora<24){
imagen="/imagenes/noche.jpg";
}
document.images["reloj"].src=imagen;
}
</script>
<title>Untitled</title>
</head>
<body onload="cargarImagen()">
<img src="imagenes/amanece.jpg" name="reloj" class="img_bg" alt="Fondo de web"/>
</body>
</html>
(http://cgrupo.com.nu/fondo_plantilla.html)
Mi objetivo es que el fondo cambie dependiendo la hora y q se ajuste dependiendo la resolucion del navegador.
Pero aqui me hace todo como imagen no como background.
Queria saber si podrian desirme como hacer la pagina sobre la imagen.
Gracias :D de antemano