basicblue : Blue « Templates « HTML / CSS






basicblue

     

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>Basic - Blue by BlogIreland.ie</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta content="blogireland.ie" name="Author" />
<meta content="2006blogireland.ie" name="Copyright" />
<meta content="blogireland.ie" name="Designer" />
<meta content="General" name="Rating" />
<meta content="index,follow" name="Robots" />
<meta content="30" name="revisit-after" />
<meta content=" Insert your site description here" name="description" />
<meta content="Insert your site keywords here" name="keywords" />

<style type='text/css'>
/***********************************************/
/* 3col_leftNav.css                             */
/* Use with template 3col_leftNav.html          */
/***********************************************/

/***********************************************/
/* HTML tag styles      background: #EEEEEE url("imgs/bg_main.jpg") repeat-y center;                            */
/***********************************************/ 

body {
  font-family: Verdana,Arial, sans-serif;
  color: #5E86C3;
  line-height: 1.166;  
  margin: 0px;
  padding: 0px;
  background-color: #2A80C3;
}

a{
  color: #800000;
  text-decoration: none;
}

a:link{
  color: #000000;
  text-decoration: none;
}

a:visited{
  color: #880000;
  text-decoration: none;
}

a:hover{
  color: #BDA57B;
  text-decoration: underline;
}

h1{
 font-family: Comic Sans MS;
 font-size: 160%;
 color: #800000;
 margin: 0px;
 padding: 0px;
 text-align: center;
}

h2 {
padding-right: 0px; 
padding-left: 0px; 
padding-bottom: 0px;
padding-top: 0px;
margin: 0px; 
font: bold 114% Arial,sans-serif; 
color: #000000;
}

h3{
 font-family: Arial,sans-serif;
 font-size: 100%;
 color: #334d55;
 margin: 0px;
 padding: 0px;
}

h4{
 font-family: Arial,sans-serif;
 font-size: 130%;
 color: #800000;
 margin: 0px;
 padding: 0px;
}

h5{
 font-family: Verdana,Arial,sans-serif;
 font-size: 100%;
 color: #334d55;
 margin: 0px;
 padding: 0px;
}

h6{
 font-family: Arial,sans-serif;
 font-size: 60%;
 color: #29E63A;
 margin: 0px;
 padding: 0px;
 text-align: center;
}

ul{
 list-style-type: square;
}

ul ul{
 list-style-type: disc;
}

ul ul ul{
 list-style-type: none;
}

label{
 font-family: Arial,sans-serif;
 font-size: 100%;
 font-weight: bold;
 color: #000000;
}


/***********************************************/
/* Layout Divs                                 */
/***********************************************/

#masthead{
  padding: 0px 0px 0px 0px;
  border-bottom: 1px solid #3964A9;
        border-top: 1px solid #3964A9;
  width: 100%;
        height: 10%;
        background-color: #1d1cfe;
        position: relative;
        top: 0px;
        left: 0px;
        z-index: 1;
}



#pagecell1 {
        left: 5px;
  /*right: 5px;*/ 
        width: 98%; 
        position: relative; 
        top: 15px;
        border-top: 2px solid #000000;
  border-left: 3px solid #000000;
  border-right: 3px solid #000000;
  border-bottom: 3px solid #000000;
        bottom: 5px; 
        background-color: #ffffff;
        padding: 0px 0px 0px 0px;
}


#tl {
  PADDING-RIGHT: 0px; 
        PADDING-LEFT: 0px; 
        Z-INDEX: 100; 
        LEFT: -1px; 
        PADDING-BOTTOM: 0px; 
        MARGIN: 0px; 
        PADDING-TOP: 0px; 
        POSITION: absolute; 
        TOP: -1px
}
#tr {
  PADDING-RIGHT: 0px; 
        PADDING-LEFT: 0px; 
        Z-INDEX: 100; 
        RIGHT: -1px;   
        PADDING-BOTTOM: 0px; 
        MARGIN: 0px; 
        PADDING-TOP: 0px; 
        POSITION: absolute; 
        TOP: -1px
}


#tla {
  PADDING-RIGHT: 0px; 
        PADDING-LEFT: 0px;  
        PADDING-TOP: 0px;
        PADDING-BOTTOM: 0px;
        Z-INDEX: 100; 
        LEFT: -1px;  
        MARGIN: 0px; 
        POSITION: absolute; 
        bottom: -1px
}
#trb {
  PADDING-RIGHT: 0px; 
        PADDING-LEFT: 0px;
        PADDING-BOTTOM: 0px;
        PADDING-TOP: 0px; 
        Z-INDEX: 100; 
        RIGHT: -1px;    
        MARGIN: 0px;  
        POSITION: absolute; 
        bottom: -1px
}

#pic{
        position: relative;
        top: 10px;
        left: 250px;
        z-index: 1;
}

#pageName {
        margin: 0px;
  padding-right: 0px; 
        padding-left: 10px; 
        padding-bottom: 14px;  
        padding-top: 0px; 
        background-color: #ffffff
}


#content{
        width: 90%;
        padding: 10px 10px 20px 30px;
        margin: 0;
        background-color: #ffffff;
}

/***********************************************/
/* Components                                  */
/***********************************************/

#siteName{
  margin: 0;
  padding: 0px 0px 0px 10px;
}


/************* #globalNav styles 5E86C3EF0B0B**************/

#globalNav{
        font-family: Verdana,Arial, sans-serif;
        text-transform: uppercase;
        color: #000000;
        padding: 0px 0px 5px 10px;
        border-top: 1px solid #000000; 
        border-bottom: 2px solid #000000;
        /*background-color: #5E86C3;*/
        background: #FFFFFF url("basicblue-images/bg_menu.jpg") repeat left;
        text-align: center;
}

#globalNav img{
        display: block;
        background-color: #5E86C3;
}

#globalNav a {
        font: bold 114% Arial,sans-serif;
        background: #FFFFFF url("basicblue-images/bg_menu.jpg") repeat left;
        color: #000000;
  font-size: 90%;
  padding: 0 4px 0 0;
        background-color: #5E86C3;
}

#globalNav a:hover{
        font-family: bold 114% Arial, sans-serif;
  color: #FBE551;
  font-size: 90%;
  text-decoration: underline;
        background-color: #5E86C3;
        background: #EEEEEE url("imgs/bg_main.jpg") repeat-y center; 
}


/************* #siteInfo styles ***************/

#siteInfo{
  clear: both;
  border: 0px solid #cccccc;
  font-size: 65%;
  color: #800000;
  padding: 2px 2px 2px 2px;
        background-color: #ffffff;
  text-align: center;
}

#siteInfo a:hover{
        font-family: Verdana,Arial, sans-serif;
  color: #800000;
  text-decoration: underline;
}

a{
  color: #800000;
  text-decoration: none;
}

a:link{
  color: #800000;
  text-decoration: none;
}

a:visited{
  color: #800000;
  text-decoration: none;
}


img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto; 
}


</style>



</head>
<body id="body">

<!-- pagecell1 -->
<div id="pagecell1">

<div id="masthead">
<p style="text-align: center;"><img src="basicblue-images/stock-insert.jpg" alt="" height="62" width="702" /></p>
</div>

    <div id="globalNav">
| <a href="index.html">Home</a> | <a href="#">About Us</a> | <a href="#">Link</a> | <a href="#">Link</a> | <a href="#">Link</a> | <a href="#">Link</a> | <a href="#">Link</a> | <a href="#">Link</a> | <a href="#">Link</a> | <a href="#">Link</a> |
  </div> 


 <br /><br /><hr />
<div id="content">
<div><br /></div><br />
<div>
<p>I originally developed this template from an adapted Dreamweaver 6.0 template. 
You'll need to change images for your own and css is easy enough to change height-width changes if required. 
Feel free to use but like I say in the readme file, I would like to know where it is :).
I variate the color in this for hosting basic sites. Mostly css work - image changes. 
I also have a variation I'm currently working on that has an imbedded side nav bar. That should be ready soon.
I'll upload it a copy of that when it is done.</p></div>
</div>
<hr />
<div id="siteInfo">
  <p><a href="#">Link</a>  | <a href="#">Link</a> | <a href="#">Link</a> | <a href="#">Link</a> |</p>
</div>
<img id="trb" alt="" src="basicblue-images/trb.jpg" height="6" width="6" /><img id="tla" alt="" src="basicblue-images/tla.jpg" height="6" width="6" />
</div>
<!-- end content -->
<div><br /></div> 
<div>
<h6> &copy; BlogIreland.ie 2006 All Rights Reserved. <a href="http://www.blogireland.ie/">Design by: Blogireland.ie</a></h6>
</div> 
<div><br /></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.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