bluey : Blue « Templates « HTML / CSS






bluey

     

<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Bluey</title>
<style type='text/css'>
body                  {background-color:#ddd;font-family:Georgia,sans-serif;font-size:80%;}
h1                    {font-size:19pt;}
h2                    {font-size:15pt;}

div#wrap              {margin:auto;width:80%;background-color:#fff;padding:1em;border:5px solid #ccc;}

div#header            {background-color:#356aa0;color:#fff;padding:1em;margin-bottom:.5em;}
div#header h1         {margin:0;padding:0;}
div#header h2         {margin:0;padding:0;}

div#nav               {background-color:#333;color:#eee;float:left;width:100%;text-align:center;margin-bottom:.5em;}
div#nav ul            {margin:0;padding:0;float:left;}
div#nav li            {display:inline;margin:0;padding:0;margin-right:.5em;}
div#nav li a          {padding:5px;text-decoration:none;color:#eee;float:left;width:5em;border-right:1px solid #ccc;}
div#nav li a:hover    {color:#eee;background-color:#555;}

div#content           {padding:2em 1em;}
div#content h2        {border-bottom:1px solid #ddd;margin-bottom:.5em;}
div#content img.fancy {border:1px solid #ddd;padding:.5em;}
div#content img.left  {float:left;margin-right:1em;}
div#content img.right {float:right;margin-left:1em;}

div#footer            {text-align:center;margin-top:.5em;}
</style>


</head>
<body>
<div id="wrap">
<div id="header">
  <h1>Bluey</h1>
  <h2>The subtitle for Bluey</h2>
</div>

<div id="nav">
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Blog</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
</div>

<div id="content">
<h2>This is a header.</h2>
<img src="images/spacer.gif" alt="spacer.gif" class="fancy left" style="height:100px;width:100px;" />
<p>I couldn't think of a more creative name of this theme. It's a simple theme with a blue header. This theme should be able to stretch and pull without breaking apart much and there are no images in the design itself. If you have questions, comments, or complaints, send them to dabbaking [at] gmail [dot] com.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce quis mauris non risus pharetra viverra. Aliquam id enim id lacus condimentum tempus. Phasellus at mi. Phasellus egestas malesuada arcu. Nam pretium hendrerit leo. Nulla quam. Mauris fringilla. Etiam tristique nulla vel metus. Maecenas semper condimentum lacus. Proin vulputate. Suspendisse potenti. Proin sem mauris, suscipit eleifend, suscipit vel, consectetuer bibendum, odio.</p>
<p>Ut ante. Phasellus tortor augue, blandit in, blandit at, volutpat ac, augue. Nunc posuere felis nec pede. Vivamus eget enim sit amet augue tempor consequat. Integer semper lacus ac mi. Praesent luctus rutrum urna. Mauris dolor odio, sodales ut, posuere in, tincidunt nec, massa. Quisque ultrices. Etiam sed risus. Nulla blandit feugiat est. Pellentesque at tortor non massa feugiat pulvinar. Integer euismod. Duis ultricies nisl id metus. Suspendisse sollicitudin hendrerit augue. Nulla sollicitudin eleifend nulla. Nulla ultrices lectus vitae eros. Etiam et felis. Nam suscipit, quam vitae pulvinar rutrum, purus sem ultricies mauris, et convallis dolor arcu a libero. Pellentesque malesuada auctor libero.</p>
<h2>This is another header.</h2>
<img src="images/spacer.gif" alt="spacer.gif" class="fancy right" style="height:100px;width:100px;" />
<p>Sed varius nunc a diam. Nullam semper posuere justo. Integer venenatis. Cras arcu. Maecenas vitae purus eu mi iaculis viverra. Proin orci. Integer eu mi. Fusce lacinia consectetuer dui. Integer ornare auctor risus. Integer sit amet erat. Vivamus elementum risus in quam. Aliquam ac diam ac tellus vestibulum tristique. Quisque pharetra ullamcorper mi. Mauris est sapien, condimentum eget, faucibus id, viverra posuere, erat. Nunc eleifend purus ut tortor.</p>
<p>Ut pellentesque. Nulla pede mi, laoreet non, varius nec, congue ut, neque. Vivamus aliquam, est id suscipit facilisis, nibh tortor porttitor diam, ut rutrum massa lectus id turpis. Curabitur molestie urna nec velit. Donec egestas. Aenean odio tortor, aliquet et, ornare vel, pharetra a, tellus. Duis pede eros, rhoncus ac, tempor euismod, tincidunt quis, nisi. Nunc rhoncus, dui eget dictum tincidunt, mauris neque consequat enim, in accumsan orci odio a enim. Nulla id sapien. Suspendisse fermentum turpis interdum ipsum hendrerit adipiscing.</p>
<p>Sed auctor dolor ac leo. Nullam ac nisi. Integer rhoncus rhoncus quam. Phasellus ut ligula. Nunc ac felis et ante malesuada venenatis. In hac habitasse platea dictumst. Praesent tellus nisl, tempor at, faucibus id, molestie sit amet, risus. Pellentesque varius dignissim orci. Mauris lorem. Integer vulputate massa quis nibh.</p>
</div>
</div>
<div id="footer">
&copy; 2008 You Inc. - Design by <a href="http://darkfate.info/">darkfate</a>
</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.blue_circles
52.blue_sky
53.blue_space
54.blue_trees
55.bublue-studio
56.bussinesblue
57.fain-blue
58.fairyblue
59.basicblue
60.CleanandBlue
61.cleanblue
62.freecss_blue
63.flyingblue
64.easy-blue
65.FunkyCoolBlue
66.genericblue
67.gallery-blue
68.MonsterBlue
69.Simple_Blue
70.wide-blue
71.a_bit_modern_bigBlue
72.mistyblue
73.portal_blue
74.SimplyBlue
75.sleekcssblue
76.Sexy_Blue
77.WonderfulBlue
78.sweetbuzzblue
79.light-blue
80.groovyblue
81.iblue2b