Quiero estudiar este código fuente, y ante todo quisiera saber qué tipo de achivo es para guardarlo. ¿Html? Gracias por la ayuda.
<!DOCTYPE html>
<html lang="es-ar">
<head>
<meta charset="utf-8" />
<title>slide de fondo</title>
<style type="text/css">
/*<![CDATA[*/
html, body {
margin: 0;
padding: 0;
height: 100%;
}
img#bg {
min-height: 100%;
min-width: 1024px;
width: 100%;
height: auto;
position: fixed;
top: 0;
left: 0;
}
@media screen and (max-width: 1024px){
img#bg {
left: 50%;
margin-left: -512px; }
}
#contenido{
position: relative;
width: 700px;
height: 100%;
margin: 0px auto;
padding: 20px;
background: transparent;
-moz-box-shadow: 0 0 20px black;
-webkit-box-shadow: 0 0 20px black;
box-shadow: 0 0 20px black;
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
}
h1{
color: darkred !important;
}
.contenido_extra{
position: absolute;
top: 200px;
border: 1px solid #696;
-webkit-box-shadow: #666 0px 2px 3px;
-moz-box-shadow: #666 0px 2px 3px;
box-shadow: #666 0px 2px 3px;
background: #EEFF99;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#EEFF99), to(#66EE33));
background: -webkit-linear-gradient(#EEFF99, #66EE33);
background: -moz-linear-gradient(#EEFF99, #66EE33);
background: -ms-linear-gradient(#EEFF99, #66EE33);
background: -o-linear-gradient(#EEFF99, #66EE33);
background: linear-gradient(#EEFF99, #66EE33);
-pie-background: linear-gradient(#EEFF99, #66EE33);
behavior: url(/css3/PIE/PIE.htc);
width: 130px;
height: 130px;
-webkit-border-radius: 130px;
-moz-border-radius: 130px;
border-radius: 130px;
padding: 65px;
text-align: center;
margin: 50px;
}
img#logo{
-webkit-border-radius: 130px;
-moz-border-radius: 130px;
border-radius: 130px;
position: fixed;
bottom: 10%;
right: 10%;
border: solid dotted 2px;
}
.pie{
position: relative;
width: 100%;
height: 20px;
padding: 15px 0;
background: #000;
color: #FFF;
font-size: 15pt;
text-align: center;
font-family: verdana, sans-serif
margin: 0 0 150px 0;
}
/*]]>*/
</style>
<script type="text/javascript">
//<![CDATA[
var ImagenPrueba = new Image();
var fondos = ['bg2.jpg', 'bg3.jpg','bg1.jpg'];
var fondo_actual = 0;
var CambiarFondo = function(){
if (fondo_actual == fondos.length) {
fondo_actual = 0;
}
var precargar =fondo_actual++;
ImagenPrueba.src = fondos[precargar];
ImagenPrueba.onload = function(){
document.getElementById('bg').src = this.src;
}
}
window.setInterval(CambiarFondo, 5000);
//]]>
</script>
</head>
<body>
<img src="bg.jpg" id="bg" onclick="cambiar('this');" alt="" />
<div id="contenido">
<h1>Contenido</h1>
</div>
<img src="los-simpsons.jpg" id="logo" alt="" />
<div class="contenido_extra">
Contenido Extra
</div>
<div class="pie">
mas contenido
</div>
<p>Fin </p>
</body>
</html>