~D13 - css-graveyard

css-graveyard

Vista Previa:Link

Texto por encima de la pagina

<div id="wrapper">
<div id="header">
<div id="hgroup">
<h1>Titulo de la pagina</h1>
<h3>Sibtitulo de la pagina</h3>
</div>
</div>
<div id="aside">
<form class="search" method="get" action="http://www.google.com/search"> <input name="q" placeholder="Buscar en el sitio..." type="text"><input style="display: none;" name="sitesearch" value="darknet13.es.tl" checked="checked" type="radio">
</form>
<h2 class="menu">Menu1</h2>
<ul class="menu">
  <li><a href="#">Link1</a></li>
  <li><a href="#">Link2</a></li>
  <li><a href="#">Link3</a></li>
  <li><a href="#">Link4</a></li>
  <li><a href="#">Link5</a></li>
</ul>
<h2 class="menu">Menu2</h2>
Lorem ipsum dolor sit amet, consectetur adipisicing
elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo <a href="#">consequat</a>. Duis
aute irure dolor
in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
pariatur.
</div>

Texto por debajo de la pagina

<div id="footer">copyright 20xx-2012 tu web
<div id="legal">Diseño por <a target="_blank" href="http://darknet13.es.tl">~D13</a></div>
</div>
</div>

CSS Code sin Style Tags

a img {border: 0px;}
#header_container {display: none;}
#nav_container {display: none;}
#sidebar_container{display:none;}
h2#title {display: none;}
table[height ="102"] {margin-right:auto;margin-left:auto;}
#counter {display:none;}
* {
  margin: 0px;
}
body {
  color: #666666;
  font-family: Arial,Helvetica,sans-serif;
  background-color: black;
  font-size: 13px;
}
a:link {
  color: #00008a;
}
a:visited {
  color: #643164;
}
#wrapper {
  border: 1px solid #5a5a5a;
  width: 800px;
  margin-right: auto;
  margin-left: auto;
  background-color: black;
}
#header {
  background-image: url(https://img.webme.com/pic/d/darknet13/graveyardhdr.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  height: 150px;
  margin-bottom: 10px;
  position: relative;
}
#hgroup {
  position: absolute;
  bottom: 0px;
  left: 5px;
}
#hgroup h1 {
  font-size: 25px;
  color: #004900;
}
#hgroup h3 {
  font-size: 15px;
  color: #414141;
  font-style: italic;
}
#aside {
  float: left;
  width: 200px;
  margin-bottom: 10px;
  margin-left: 1px;
}
#aside h2.menu {
  font-family: "Times New Roman",Times,serif;
  font-size: 19px;
  text-transform: capitalize;
  font-weight: bold;
  text-align: center;
  color: #004900;
}
#aside ul.menu {
  padding: 0px;
  list-style-type: none;
}
#aside ul.menu li a {
  list-style-position: inside;
  display: list-item;
  list-style-type: circle;
  text-decoration: none;
  color: #595959;
  list-style-image: url(https://img.webme.com/pic/d/darknet13/graveyardlia.png);
}
#aside ul.menu li a:hover {
  list-style-type: disc;
  color: #999999;
  list-style-image: url(https://img.webme.com/pic/d/darknet13/graveyardlihover.png);
}
#content {
  float: left;
  width: 588px;
  margin-left: 10px;
  margin-bottom: 10px;
}
#footer {
  clear: left;
  text-align: center;
  position: relative;
}
#legal {
  position: absolute;
  bottom: 0px;
  right: 2px;
  font-size: 9px;
  font-family: "Times New Roman",Times,serif;
}
#legal a {
  color: #666666;
  text-decoration: none;
}
.search input {
  border: 2px groove #0f0f0f;
  background-color: black;
  color: #666666;
  width: 100%;
}
form.search {
  border-style: none;
  color: #666666;
  width: 100%;
}