darkgrunge : Dark « Templates « HTML / CSS






darkgrunge

  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Dark Grunge</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
/* CSS Document */

body{

text-align:center;

background:url(darkgrunge-images/back.jpg) top center repeat-y;

background-color:#000000;

font-family:Arial;

color:#FFFFFF;

line-height:1.5em;

font-size:14px;

}

a:link, a:visited{

color:#A8D3E7;

}

a:hover {

color:#3ebcef;

}

#wrapper{

margin:auto;

width: 778px;

text-align:left;

padding-left:1px;

}


/* ......................................Top Nav........................................................... */


#nav {

margin-bottom:0;
  
padding:0;
  

}


ul#menu{

margin:0;
  
padding:0;
  
list-style-type:none;
  
position:relative;
  
display:block;

height:40px;
  
font-size:13px;
  
font-weight:bold;
  
background-color:#333333;

}



#menu li{

display:block;
  
float:left;
  
margin:0;
  
padding:0;
  
}
  
  

#menu li a{

display:block;
  
float:left;
  
color:#FFFFFF;
  
text-decoration:none;
  
font-weight:bold;
  
padding:11px 20px 0 20px;
  
height:29px;
  
margin:0;
  
border-right:1px solid #474646;
  
}
  
  

#menu li a:hover{

background-color:#e3007a;  
  
}
  


/* ......................................Content........................................................... */


.line{

border-top: 1px dashed #666666;

}

h1 {

color:#CCCCCC;

background:url(darkgrunge-images/headline_back.jpg) top left no-repeat;

padding-top:5px;

height: 53px;

font-size:30px;

letter-spacing:5px;

margin:40px 0 20px 0;

}

h2 {

color:#e3007a;

padding-top:25px;

font-size: 20px;

letter-spacing:3px;


}


#content{

width:778px;

text-align:left;

}


.clear{

clear:both;

}

.footer {

height:50px;

}

</style>


</head>
<body>
<div id="wrapper">
  <div id="nav">
    <h1>Dark Grunge </h1>
    <ul id="menu">
      <li><a href="http://www.free-css.com/">Home</a></li>
      <li><a href="http://www.free-css.com/">About</a></li>
      <li><a href="http://www.free-css.com/" >Services</a></li>
      <li><a href="http://www.free-css.com/">Portfolio</a></li>
      <li><a href="http://www.free-css.com/">Contact</a></li>
    </ul>
    <img src="darkgrunge-images/main.jpg" alt="" /> </div>
  <div id="content">
    <h2>Dark Grunge  - Free Template </h2>
    <p>This free  template was designed by the Template Tower and is licensed under a <a target="_blank" href="http://creativecommons.org/licenses/by/2.5/">Creative Commons Attribution 2.5 License</a>. Dark Grunge is free for any commercial or personal use provided you link back to <em>templatetower.com</em>.  All Free and Deluxe Templates on Template Tower are W3C standards compliant and valid CSS/XHTML. The Tower is focused on providing only the most creative, beautiful, and original table-free templates on the web.</p>
    <div class="line"></div>
    <h2>Want This Template Customized?</h2>
    <p>If you do not want to customize this template  yourself please contact the Tower for pricing. We can adjust an existing template or create a totally custom site. </p>
    <div class="line"></div>
    <h2>Try a Deluxe Template </h2>
    <p>Every site on Template Tower must meet strict guidelines but only the finest websites will actually make it onto this exclusive showcase. Deluxe templates have their own  set of terms and conditions and do not need a link back to Template Tower. Besides the index file, css, and images these templates  also include any necessary php script. <a href="http://www.free-css.com/">Deluxe Templates</a></p>
    <div class="line"></div>
    <div class="footer"></div>
    <p>Your Site &copy; 2007 - design by <a href="http://templatetower.com">templatetower.com </a></p>
    <p>&nbsp;</p>
  </div>
</div>
</body>
</html>

   
    
  








Related examples in the same category

1.metamorph_darkmare
2.metamorph_darknessfall
3.metamorph_darkside
4.metamorph_darksky
5.metamorph_nightsky
6.dark-effect-v2
7.dark-pro
8.Dark 2
9.DarkColors
10.darkened
11.darkforest
12.DarkFusion
13.darkit
14.darkportfolio
15.darkshine
16.DarkSplinter
17.darkTech
18.darktheme
19.Dark_Portal
20.shadowed
21.midnight
22.midnightalley
23.Dark background, white links
24.Dark background with white border
25.Dark backgrounds