WonderfulBlue : Blue « Templates « HTML / CSS






WonderfulBlue

   

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>title</title>
<style type='text/css'>
body {
  text-align:center;
}
a {
  text-decoration:none;
}
a:hover {
  text-decoration: underline;
}
#wrap {
  width:800px;
  text-align:left;
  margin:0 auto;
  background:url(WonderfulBlue-images/bg.jpg) no-repeat
}
.float-l {
  float:left
}
.folat-r {
  float:right
}
.clearfix {
  clear:both
}
/* header */
#header {
  background:url(WonderfulBlue-images/hd.gif) no-repeat;
  height:132px
}
#header h1 {
  font-size:38px;
  padding-top: 32px;
  padding-left: 80px;
  color:#294352
}
#header h1 span {
  font-size:16px
}
ul#nav {
  padding-left:40px;
  overflow:hidden;
}
ul#nav li {
  float:left;
  height:50px;
}
ul#nav li a {
  color:#fff;
  font-weight:700;
  height:50px;
  padding:16px 20px;
  margin:0 25px;
  line-height:50px;
  width:100px
}
ul#nav li a:hover {
  background:url(WonderfulBlue-images/nav_hover.gif) no-repeat;
  height:50px;
  padding:16px 20px;
  margin:0 25px;
  line-height:50px;
}
/* content */
#content {
  background:url(WonderfulBlue-images/content.gif) no-repeat;
  height:538px;
  padding:0 15px;
  color:#fff
}
#content a {
  color:#b9dbf5
}
.left {
  width: 260px;
  padding-left:35px
}
.left h2, .blog h2 {
  font-size:26px;
  font-weight:700;
  padding:20px 0
}
#inner {
  padding-top:80px
}
.right {
  width: 330px;
  padding-right: 40px;
}
.blog {
  height: 150px;
  padding-bottom: 40px;
}
/* footer */
#footer {
  background:url(WonderfulBlue-images/ft.gif) no-repeat;
  height:100px;
  text-align:center;
  padding-top: 30px;
  color:#fff
}
#footer a {
  color:#fff
}

</style>


<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="wrap">
  <div id="header">
    <ul id="nav">
      <li><a href="#">Home</a></li>
      <li><a href="#">About us</a></li>
      <li><a href="#">Production</a></li>
      <li><a href="#">Submission</a></li>
      <li><a href="#">Contact</a></li>
    </ul>
    <h1>ROBOTCC<span>short slogan here</span></h1>
  </div>
  <!-- /header -->
  <div id="content">
    <div id="inner">
      <div class="left float-l">
        <h2>Free CSS Templates</h2>
        <p>This is ROBOTCC, 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 Creative Commons Attributions 2.5 license, 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 :) </p>
      </div>
      <div class="right folat-r">
        <div class="blog">
          <h2>Free CSS Templates</h2>
          <p>This is ROBOTCC, a free, fully standards-compliant CSS template designed by <a href="http://www.free-css-templates.com/">Free CSS Templates</a>.</p>
        </div>
        <div class="blog">
          <h2>Free CSS Templates</h2>
          <p> This free template is released under a Creative Commons Attributions 2.5 license, 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 :) </p>
        </div>
      </div>
    </div>
  </div>
  <!-- /content -->
  <div id="footer">
    <div id="ftlink"> <a href="#">Home</a> | <a href="#">About Us</a> | <a href="#">Production</a> | <a href="#">Submission</a> | <a href="#">Contact</a> </div>
    <p id="copyright"> 2008. All Rights Reserved. <br/>
      <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></p>
    <div id="xhtml"><img src="WonderfulBlue-images/xhtml.gif" alt=" xhtml vaild" /> <img src="WonderfulBlue-images/css.gif" alt="css vaild" /></div>
  </div>
  <!-- /footer -->
</div>
</body>
</html>

   
    
    
  








Related examples in the same category

1.metamorph_blue
2.metamorph_bluefeather
3.metamorph_blueflower
4.metamorph_blueglowing
5.metamorph_bluemadness
6.metamorph_bluemess_lt2
7.metamorph_bluerock
8.metamorph_bluething
9.metamorph_bluewave
10.metamorph_bubbleblue_lt
11.metamorph_bubblesonblue
12.metamorph_lightblue
13.metamorph_shiningblue
14.metamorph_simpleblue
15.metamorph_uberblue
16.metamorph_wavesinblue
17.blue-hosting
18.blue-neutral
19.blue-pigment1
20.blue-sky
21.blue-white
22.blue-wood
23.Blue 1
24.blue99
25.blueblogtemplate
26.bluebottle
27.BlueBridge
28.bluebrush
29.bluebusiness
30.bluecarbon
31.bluecorporation
32.bluediamond
33.blueflex
34.BlueFlower
35.BlueFresh
36.bluegray
37.blueled
38.blueminimal
39.blueminimalsidebar
40.blueprism
41.Blueshine
42.blueshuffle
43.BlueSpace
44.BlueSquareShadow
45.bluesurge
46.bluethickline
47.bluetoolkit
48.bluewave
49.blueweb
50.blueworld
51.bluey
52.blue_circles
53.blue_sky
54.blue_space
55.blue_trees
56.bublue-studio
57.bussinesblue
58.fain-blue
59.fairyblue
60.basicblue
61.CleanandBlue
62.cleanblue
63.freecss_blue
64.flyingblue
65.easy-blue
66.FunkyCoolBlue
67.genericblue
68.gallery-blue
69.MonsterBlue
70.Simple_Blue
71.wide-blue
72.a_bit_modern_bigBlue
73.mistyblue
74.portal_blue
75.SimplyBlue
76.sleekcssblue
77.Sexy_Blue
78.sweetbuzzblue
79.light-blue
80.groovyblue
81.iblue2b