Ayuda - Webmaster Foros
!Bienvenid@¡

Encuentra Aportes de Diseño & Desarrollo Web, para colocar tus aportes crea una nueva cuenta.

¡Que la pases bien y hasta pronto!

[Diseño Css] Para Pagina Web Gratis

Ir abajo

[Diseño Css] Para Pagina Web Gratis

Mensaje por Orbe el Sáb 24 Mar - 14:57


Texto por encima de la página:
Código:
<div id="wrap">
  <div id="header">
      <img src="http://www.imagengratis.org/images/blankheade.gif" alt="Header"  />
  </div>
  <div id="content">
      <div id="left">
        <h1>Menù</h1>
        <ul>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
        </ul>
        <h2><a href="http://viadeescape.es.tl/Home.htm">Vìa de Escape</a></h2>
        <h1>Menù</h1>
        <ul>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
        </ul>
        <h2><a href="http://viadeescape.es.tl/Home.htm">Vìa de Escape</a></h2>
      </div>
      <div id="middle">
        <h1>Bienvenidos a mi Web</h1>
Texto por debajo de la página:
Código:
</div>
 <div id="right">
        <h1>Menù</h1>
     
<ul>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">LinkPrueva</a></li>
            <li><a href="#">LinkPrueva</a></li>
            <li><a href="#">LinkPrueva</a></li>
        </ul>
        <h2><a href="http://viadeescape.es.tl/Home.htm">Vìa de Escape</a></h2>
        <h1>Menù</h1>
        <ul>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
        </ul>
        <h2><a href="http://viadeescape.es.tl/Home.htm">Vìa de Escape</a></h2>
        <h1>Menù</h1>
        <ul>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
            <li><a href="#">Link Prueva</a></li>
        </ul>
        <!-- You Must Not Remove This! -->
        </div>
<div id="footer">
        <div class="footerLeft"></div>
        Todos los Derechos Reservados Desing by <a href="http://viadeescape.es.tl/Home.htm">Via de Escape</a>
          </div>
                    </body>
                        </html>
CSS-Code
sin Style Tags:

Código:
lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
li.nav_element{list-style-type: none;}
li.nav_element{display: none;}
/* CSS Document */

html, body {
  background-color:#202020;
  margin:0;
  padding:0;
  font-family: Arial, Verdana, "Trebuchet MS", Tahoma,  Helvetica, sans-serif;
  font-size:10px;
  color:#b5b5b5;
}
a img {
  border:none;
}
h2 {
  text-transform: lowercase;
}
#wrap {
  background-color: #202020;
  margin:0 auto;
  padding:0;
  width:802px;
}
#header {
  height:156px;
  text-align:center;
}
#left, #right, #middle {
  width:200px;
  float:left;
  margin-right:1px;
  margin-top:-3px;
}
#left, #right {
  color: #FFF;
  text-transform: lowercase;
}
#right {
  margin-right:0;
}
* html #left, * html #right {
  margin-top:3px;
}
#middle {
  width:400px;
  margin-top:-1px;
  font-size:11px;
  line-height:150%;
  background:#272727;
}
* html #middle {
  margin-top:-2px;
}
#footer {
  margin: 0 auto;
  height:34px;
  clear:both;
  background-image:url(aqui);
  text-align:right;
  padding-right:20px;
  width:760px;
  padding-top:5px;
  margin-top:10px;
}
#footer img {
  vertical-align: bottom;
}
.footerLeft {
  float: left;
  width: 100px;
  margin-left: 161px;
  margin-top: 4px;
  padding-left: 3px;
  color: #FFF;
}
#middle h1 {
  background:#000 url(http://www.clantemplates.com/templates/crysis_dangerdanger/images/middle_h1.gif) no-repeat;
  width:380px;
  height:25px;
  margin:0 auto -10px auto;
  padding: 15px 0 0 20px ;
  font-size:11px;
}

#middle p,
#middle h2 {
  font-size:11px;
  margin-left: 10px;
  margin-right:10px;
}
#left h1, #right h1 {
  background-image:url(http://www.imagengratis.org/images/sidetop.gif);
  width:175px;
  height:20px;
  padding-left:25px;
  padding-top:9px;
  font-size:11px;
  margin-bottom:2px;
  font-weight: normal;
}
#left h2, #right h2 {
  background-image:url(http://www.imagengratis.org/images/sidebot.gif);
  width:185px;
  height:21px;
  text-align:right;
  padding-right:15px;
  padding-top:9px;
  font-size:11px;
  margin:0;
  font-weight:normal;
}
#left ul, #right ul  {
  list-style:none;
  margin:0;
  padding:0;
  background:#272727 url(http://www.imagengratis.org/images/sideul.gif) repeat-y top;
}
#left li, #right li {
  list-style:none;
  background:#202020 url(http://www.imagengratis.org/images/sideli.gif) no-repeat center top;
  width:170px;
  height:16px;
  margin:0 auto;
  padding:2px 0 0 20px;
}
#left li:hover, #right li:hover {
  background-image:url(http://www.imagengratis.org/images/overli.gif);
}
a, a:link, a:visited {
  color:#FFFFFF;
  text-decoration:none;
}
a:hover {
  text-decoration:underline;
}
div.ct {
  margin: 0;
  margin-top: 5px;
  padding: 0;
  padding-left: 5px;
  background: transparent;
}

_________________
chatdelmundo.wapego.net
avatar
Orbe
Mod. Global
Mod. Global

Mensajes : 388

http://chatdelmundo.wapego.net

Volver arriba Ir abajo

Volver arriba

- Temas similares

 
Permisos de este foro:
No puedes responder a temas en este foro.