Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje22-08-2013, 21:01 (UTC)    
Título del mensaje: [Css Design] ¡ChicaDj! - Anime Template
Responder citando
Hola que tal! ..les traigo este diseño que lo hice anoche, es una adaptacion de una plantilla que descargue ,la vi y estaba algo feita..asi que le di un retoque y quedo asi.. espero les guste ,los graficos son mios y lo hice con los conocimientos de photoshop que tengo (no me juzguen 0w0)

Vista Previa:


Texto por Arriba de la Pagina:

Código:
<body>

<div id="wrap">

<div id="header">
<h1><a href="#"> Nombre de Tu Sitio Web</a></h1>
<h2>Descripcion de tu web!</h2>
</div>

<div id="menu">
<ul>
<li><a href="#">Inicio</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
</ul>
</div>

<div id="contentwrap">

<div id="content">



Texto por Debajo de la Pagina:
Código:
<div style="clear: both;"> </div>
</div>

<div id="sidebar">
<h3>Algunos Links</h3>
<ul>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>

</ul>

<h3>Otros Links</h3>
<ul>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>

</div>

<div style="clear: both;"> </div>

</div>

<div id="footer">
<p>&copy; Nombre de <a href="#">Tu Web</a> | <a href="http://armandoboni.com">Dyqan Online Css</a> | Adaptado por <a href="http://animetemplates.es.tl">Anime Templates</a>

</p>


</div>

</div>

</body>
</html>



Css style:

Código:
body {
font-family: tahoma, sans-serif;
line-height: 1.4;
font-size: 13px;
background: #000;
margin: 0;
padding: 0;
color: #fff;
}

a { color: #7a119c; text-decoration: none;}
a:hover { text-decoration: none; }

#wrap {
width: 800px;
margin: 20px auto;
}

#header {
background:url(http://img.webme.com/pic/a/animetemplates/plantilla-head.png) no-repeat;
height: 267px;
}
#header h1 {
font-family: Arial, sans-serif;
margin: 0;
padding: 80px 0 0 30px;
font-weight: 100;
color: #fff;
font-size: 29px;
letter-spacing: -2px;
line-height: 27px;
}
#header h1 a { text-decoration: none; color: #fff; }
#header h1 a:hover { text-decoration: none; color: #eee; }
#header h2 { font-size: 12px; padding: 0 0 0 30px; margin: 0; color: #fff; font-weight: 100; }

#menu {
background:url(http://img.webme.com/pic/a/animetemplates/plantilla-menu.png) no-repeat;
height: 30px;
line-height: 30px;
}

#menu ul {
list-style-type: none;
margin: 0;
padding-left: 20px;
}
#menu ul li {
display: block;
float: left;
}
#menu ul li a {
display: block;
padding: 0 10px 0 10px;
text-decoration: none;
color: #7a119c;
font-weight: 100;
font-size: 10px;
}
#menu ul li a:hover {
color: #7a119c;
background: url(images/menuover.png) repeat-x;
}

#contentwrap {
background:url(http://img.webme.com/pic/a/animetemplates/plantilla-cont.png) repeat;
padding: 10px 10px 0 20px;
}

#content {
margin-top: 10px;
float: left;
width: 510px;
}
#content h2 {
margin: 0;
color: #7a119c;
line-height: 30px;
font-weight: 100;
}

#content p { padding: 0 0 10px 0; color: #555;}
#content ul { padding: 0 20px 10px 30px; }

#sidebar {
float: right;
width: 220px;
background: #fff;
}

#sidebar h3 {
background: #7a119c;
height: 30px;
line-height: 30px;
font-weight: 100;
margin: 0; padding: 0 0 0 10px;
color: #fff;
font-size: 12px;
}

#sidebar p { padding: 0 10px 10px 10px; color: #444; }

#sidebar ul {
padding: 5px 0 10px 15px;
margin: 0;
color: #000;
list-style-type: none;
}

#sidebar ul li {
background: url(http://img.webme.com/pic/a/animetemplates/plantilla-ul.png) no-repeat center left;
padding: 1px 0 2px 22px;
margin: 0;
}
#sidebar ul li a {  }

#footer {
text-align: center;
color: #7a119c;
background:url(http://img.webme.com/pic/a/animetemplates/plantilla-foot.png) no-repeat;
height: 60px;
line-height: 70px;
}
#footer p { padding: 0; margin: 0; }
#footer a { color: #7a119c; }
#footer a:hover { text-decoration: underline; }




Por el momento voy poner esta vista de lo que era la plantilla antes de editarla por que no encuentro el link de dond ela descargue apenas la encuentre la pongo
http://img856.imageshack.us/img856/6715/xi4l.png
______________


Ultima edición por animetemplates el Jue Ago 22, 2013 5:36 pm; editado 2 veces
↑
Mensaje23-08-2013, 01:17 (UTC)    
Título del mensaje:
Responder citando
Te quedo muy bonita
______________
↑
Mensaje01-09-2013, 01:42 (UTC)    
Título del mensaje:
Responder citando
Excelente aporte! Te quedó genial! :3
______________
↑
Mostrar mensajes anteriores:   
  • Página 1 de 1

  •  
    • Saltar a:  


Powered by phpBB © 2001, 2005 phpBB Group

© 2024 webme GmbH, Alemania. Todos los derechos reservados.