, aquí os dejo el código:
Código HTML:
<HTML> <HEAD> <LINK rel="stylesheet" href="orbit-1.2.3.css"> <LINK rel="stylesheet" href="css/style.css"> <LINK rel="stylesheet" href="demo-style.css"> <SCRIPT type="text/javascript" src="jquery-1.5.1.min.js"></SCRIPT> <SCRIPT type="text/javascript" src="jquery.orbit-1.2.3.min.js"></SCRIPT> <SCRIPT type="text/javascript"> $(window).load(function() { $('#featured').orbit(); }); </SCRIPT> <STYLE type="text/css"> @font-face{ font-family:ostrich-black; src: url(fuentes/ostrich-black.ttf) format('truetype'); } body{ margin:0; padding:0; background-position:center center; background-color: black; background-image:url(fondo.png); background-repeat: no-repeat; -webkit-background-size:100%; -moz-background-size:100%; height: 100%; } #button{ padding:0; text-align: center; font-family:ostrich-black; } #button li{ font-size: 25px; background: rgba(0, 0, 0, 0.2); } #button li a{ float:left; padding: 10px; padding-left:29.85px; padding-right:29.85px; color: #FFF; text-decoration: none; } #contenedor{ margin:0 auto; width:950px; vertical-align:top; height-size:100%; background: rgba(0, 0, 0, 0.2); } #espacio1{ margin:0 auto; width:950px; height:150px; background: rgba(0, 0, 0, 0.2); } #fecha{ position:absolute; margin-top:5px; } #espacio2{ height:2%; width:950px; background: rgba(0, 0, 0, 0.0); } #menu{ margin:auto; width:950px; text-align:center; } #button li a:hover { background-color: rgba(40, 81, 150, 0.2); color: #6bb3eb; } #icons{ text-align:right; margin:35px 20px; } #fb{ float:right; -webkit-transition-property:margin-top; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:linear; } #tw{ margin-left:5px; float:right; -webkit-transition-property:margin-top; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:linear; } #tm{ margin-left:5px; float:right; -webkit-transition-property:margin-top; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:linear; } #sc{ margin-left:5px; float:right; -webkit-transition-property:margin-top; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:linear; } #yt{ margin-left:5px; float:right; -webkit-transition-property:margin-top; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:linear; } #fb:hover{ margin-top:-2px; } #tw:hover{ margin-top:-2px; } #tm:hover{ margin-top:-2px; } #sc:hover{ margin-top:-2px; } #yt:hover{ margin-top:-2px; } #musica{ margin-top:5px; margin-left:434.5px; } #hoja{ margin-left:434.5px; margin-top:200px; } #cosas{ background: rgba(0, 0, 0, 0.0); width:869px; margin:0 auto; } </STYLE> </HEAD> <BODY> <DIV id="menu"> <UL id="button"> <LI><A href="#">INICIO</A></LI> <LI><A href="#">NOTICIAS</A></LI> <LI><A href="#">TRABAJOS</A></LI> <LI><A href="#">VIDEOS</A></LI> <LI><A href="#">BLOG</A></LI> <LI><A href="#">EQUIPO</A></LI> <LI><A href="#">INFO</A></LI> <LI><A href="#">CONTACTO</A></LI> </UL> </DIV> <DIV id="espacio1"> <IMG src="raya.png"/> <DIV id="icons"> <DIV id="yt"> <IMG src="minilogos/minilogoyoutube.png"/> </DIV> <DIV id="sc"> <IMG src="minilogos/minilogosoundcloud.png"/> </DIV> <DIV id="tm"> <IMG src="minilogos/minilogotumblr.png"/> </DIV> <DIV id="tw"> <IMG src="minilogos/minilogotwitter.png"/> </DIV> <DIV id="fb"> <IMG src="minilogos/minilogofacebook.png"/> </DIV> </DIV> </DIV> <DIV id="contenedor"> <DIV class="container"> <div id="featured"> <a href=""><img src="slider.png" /></a> <a href=""><img src="slider.png" /></a> </div> </DIV> <DIV id="espacio2"> </DIV> <DIV id="cosas"> <DIV id="fecha"> <IMG src="marca.png"/> </DIV> <DIV id="musica"> <IMG src="musica.png"/> </DIV> <DIV id="hoja"> <IMG src="hoja.png"/> </DIV> </BODY> </HTML>
