DarkColors : Dark « Templates « HTML / CSS






DarkColors

  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Template5</title>
<meta http-equiv="Content-Language" content="English" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type='text/css'>
* {
    padding: 0;
    margin: 0;
} 

body {
background: #121212;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 18px;
color: #ccc;
}

img { border: none; }
a { color: #FAF391; text-decoration: none; }
a:hover { text-decoration: underline; color : #fff; }

#wrap {
width: 760px;
background: #222;
margin: 0px auto;
}
.header {
padding-top: 20px;
height: 80px;
text-transform: uppercase;
background: #333;
}
.header h1 {
font-size: 34px;
font-weight: 100;
padding: 10px 0 4px 10px;
letter-spacing: -3px;
}
.header h1 a {
color: #FAF391;
text-decoration: none; 
}
.header h1 a:hover { 
color: #fff;
text-decoration: none; 
}
.header h2 {
font-size: 17px;
font-weight: 100;
color: #fff;
padding-left: 12px;
}

.navigation { 
padding-top: 20px;
float : left ;
list-style: none; 
width: 200px;
}
.navigation ul { list-style-type: none; }
.navigation li { 
padding: 0; 
margin: 0; 
}
.navigation a, 
.navigation a:visited {
text-transform:uppercase;
display: block;
height: 25px;
line-height: 25px;
padding: 0 10px 0 10px;
color: #ffffff;
background: #222;
text-decoration: none;
border-bottom: 1px solid #171B20;
}
.navigation a:hover {
color: #000;
background-color: #FAF391;
}

.content {
padding: 10px 10px 10px 0;
float: right;
width: 540px;
}
.content h2 {
color: #FAF391;
font-size: 28px;
letter-spacing: -2px;
font-weight: 100;
padding: 10px 0 10px 0;
text-transform: uppercase;
}
.content h2 a { }
.content h2 a:hover { text-decoration: none; }

.footer {
padding: 10px;
font-size: 11px;
color: #aaa;
text-align: center;
background: #333;
}
.footer a {
color: #aaa;
}

</style>


<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="rss-articles/" />
</head>
<body>
<div id="wrap">

<div class="header"> 
<h1><a href="#">Website Title</a></h1>
<h2>Slogan of your website</h2>
</div>

<div class="content"> 
<h2><a href="#">License</a></h2>
This is Dark colors, a free, fully standards-compliant CSS template designed by <a href="http://www.free-css-templates.com">Free CSS Templates.</a>
This free template is released under a <a href="http://creativecommons.org/licenses/by/2.5/">Creative Commons Attributions 2.5 license</a>, so you're pretty much free to do whatever you want with it (even use it commercially) provided you keep the links in the footer intact. Aside from that, have fun with it
<br /><br />
<h2><a href="#">Title Example of another Article</a></h2>
<br />
<img src="pic11.gif" alt="Example pic" style="border: 3px solid #ccc;" />
<br /><br />
Lorem ipsum dolor sit amet, <a href="#">consectetuer adipiscing elit</a>. Donec porta. Sed porttitor, tellus vitae tincidunt 
feugiat, sem sapien pellentesque justo, vitae pretium justo risus id nunc. Mauris elit metus, varius sit amet, 
rhoncus id, malesuada eget, tortor. Aenean eu augue ac nisl tincidunt rutrum. Proin erat justo, pharetra eget, posuere at, malesuada 
et, nulla.
<br /><br />
</div>

<div class="navigation">
<ul>
<li><a href="#">Home</a></li> 
<li><a href="#">Organic Fruits</a></li> 
<li><a href="#">Oranges</a></li> 
<li><a href="#">Tropical Fruits</a></li>
<li><a href="#">Contact Us</a></li> 
<li><a href="#">Sitemap</a></li>
<li><a href="#">Friends Blog</a></li> 
<li><a href="#">Webmaster Tools</a></li> 
<li><a href="#">xhtml/css Design</a></li> 
<li><a href="#">Eco Gardening</a></li>
<li><a href="#">Photoshop Tutorials</a></li> 
<li><a href="#">Something new</a></li>
</ul>
</div>

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

<div class="footer">
&copy; Copyright 2008 by <a href="#">Title or Url of your Website</a> | <a href="http://www.templatesold.com/" target="_blank">Website Templates</a> by <a href="http://www.free-css-templates.com/" target="_blank">Free CSS Templates</a></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.darkened
10.darkforest
11.DarkFusion
12.darkgrunge
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