lonelyness : Effect 2 « Templates « HTML / CSS






lonelyness

   

<!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>Lonelyness</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
/* CSS Document */

* {margin: 0;
   padding: 0;}
   
body {
  font-family: Georgia, "Times New Roman", Times, serif;
}

#main {
  background-image: url(lonelyness-images/main.jpg);
  height: 399px;
  width: 741px;
  background-repeat: no-repeat;
}

#linkbar {
  background-image: url(lonelyness-images/linkbar.jpg);
  height: 43px;
  width: 741px;
  background-repeat: no-repeat;
}

#top_content {
  background-image: url(lonelyness-images/top_content.jpg);
  height: 135px;
  width: 741px;
  background-repeat: no-repeat;
}

#main_content {
  background-image: url(lonelyness-images/body_tile.jpg);
  width: 356px;
  background-repeat: repeat-y;
  padding-left: 125px;
  padding-right: 260px;
  font-size: 12px;
}

#footer {
  background-image: url(lonelyness-images/footer.jpg);
  width: 621px;
  height: 130px;
  padding-top: 100px;
  font-size: 10px;
  padding-left: 120px;
}

p {padding-bottom: 6px;
padding-top: 6px;}

h1 {
  padding-top: 40px;
  padding-left: 112px;
  color: #a9ac96;
  font-size: 24px;
  font-style: italic;
  font-family: Georgia, "Times New Roman", Times, serif;
}

h2 {
  padding-top: 0px;
  padding-left: 112px;
  color: #b3b79b;
  font-size: 12px;
  font-style: italic;
  font-family: Georgia, "Times New Roman", Times, serif;
}

h3 {
  font-size: 16px;
  font-style: italic;
  color: #8D926A;
  padding-top: 15px;
  padding-bottom: 15px;
}

blockquote {
  margin-left: 165px;
  margin-right: 300px;
  font-size: 12px;
  padding: 45px 6px 6px;
  font-style: italic;
}

#navcontainer ul
{
  padding: 16px 0 2px;
  margin-left: 160px;
  list-style-type: none;
  color: #006633;
  font-size: 90%;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
}

li { display: inline; }

li a
{
text-decoration: none;
color: #666666;
padding: .2em 1em;
}

li a:hover
{
background-color: #EDEEE8;
color: #333333;
}

</style>


</head>
<body>
<div id="main">
  <h1>Lonelyness</h1>
  <h2>By Dieter Schneider</h2>
</div>
<div id="linkbar">
  <div id="navcontainer">
    <ul id="navlist">
      <li id="active"><a href="http://www.free-css.com/" id="current">Home</a></li>
      <li><a href="http://www.free-css.com/">Item two</a></li>
      <li><a href="http://www.free-css.com/">Item three</a></li>
    </ul>
  </div>
</div>
<div id="top_content">
  <blockquote>
    <p>If you hear a voice within you say &quot;you cannot paint,&quot; then by all means paint, and that voice will be silenced.<br />
      Vincent Van Gogh</p>
  </blockquote>
</div>
<div id="main_content">
  <h3>Template by Dieter Schneider 2006 </h3>
  <p>This template was created by Dieter Schneider on a rainy day in Desmber 2006. If you want to remove the copyright and get the PSD file (which will give you a lot of flexibility with this template) you can buy it on www.csstemplateheaven.com for only seven dollars. Tested in the latest versions of FF, IE and Opera with excellent results. </p>
  <h3>Creative templates </h3>
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam ornare odio eget nulla lacinia volutpat. Donec gravida, tortor id vulputate feugiat, diam arcu porttitor sapien, sit amet rutrum augue lorem at dolor. Nullam ante. Sed vitae nisi. Donec mi. Nulla consequat leo id turpis. In sollicitudin arcu eget felis. Vestibulum cursus turpis nec nunc aliquet tristique. Nulla luctus odio non dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In hac habitasse platea dictumst. Quisque tortor tellus, congue sed, tincidunt vel, congue sed, sem. Ut in libero.</p>
</div>
<div id="footer"> &copy; <a href="http://www.csstemplateheaven.com">www.csstemplateheaven.com</a>. Design by Dieter Schneider 2006</div>
</body>
</html>

   
    
    
  








Related examples in the same category

1.bigpixels
2.binary-news
3.mosaic
4.perfection
5.plain1
6.plain2
7.plastic-surgery
8.plastics
9.overdose
10.outlined
11.optimism
12.optimistic
13.Modern_Theme
14.MultiStrangeColor
15.modern
16.minimalistic
17.primitive
18.sparkle
19.sparkling
20.spotlight
21.simplyfluid
22.slider
23.pragmatic
24.popular
25.primitif
26.pure-web-2.0
27.pure
28.reflection
29.reflections
30.royal-cyan
31.royal_policy
32.smalltown
33.smallwindow
34.smartdesign
35.smarttouch
36.splendid
37.workfire
38.webtile
39.Wide_Side
40.zionnarrow
41.zionnarrows
42.xtreme
43.ZEN
44.zenlike
45.wondrous
46.stonewalled
47.tattoopatt
48.tattoopattern
49.tastelessly
50.tasty
51.thebarn
52.tinfoil_helmet
53.tomato
54.metal-feel
55.metal
56.historical
57.historicpaper
58.historyofwar