genericblog : Blog « Templates « HTML / CSS






genericblog

    

<!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>
<title>Generic Blog</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
a, a:link, a:visited  {
text-decoration: none;
color:#000;
}
a:hover, a:active   {
text-decoration: underline;
color:#a28a71;
}

h1 {
font-size: 20px;
padding: 20px 0 0 20px;
}
h2 {
font-size: 13px;
color: #000;
padding-top: 5px;
}
h3 {
font-size: 11px;
color: #a28a71;
padding-top: 10px;
}
p {
font-size: 10px;
color: #635631;
}
form {
float: right;
padding: 0 10px 0 0;
}
input {
background: #000;
color: #fff;
border: inset 1px #000;
}
/**Everything above here is just formatting stuff, edit it if you want to change colors and whatnot...**/
.searchbutton {
width: 19px;
height: 30px;
border: none;
vertical-align: middle;
}

#header img,#content img,#footer img{display:block}

body {
background: url(genericblog-images/topbg.jpg) repeat-x #a28a71;
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-align:center; /* centre for ie5.+*/
display: block;
line-height: 1.5;
}
/* commented backslash hack \*/ 
html, body{height:100%;} 
/* end hack */
html,body {margin:0;padding:0}

body h1 {
text-align: left;
}
#wrapper {  /** Don't touch this**/
width: 604px;
margin-left: auto;
margin-right: auto;
}
#header {
background: url(genericblog-images/header.jpg) no-repeat;
height: 72px;
position: relative;
margin-top: 30px;
}
/*Menu Code Begin*/
  
#nav {  /**Don't change this either!**/
position: absolute;
left: 330px;
bottom: -16px;
list-style:none;
}

#nav li{display:inline;}
  
#nav a{
padding: 0 1px 0 1px;
float:left;
height:24px;
width:70px;
text-decoration:none;
}
      
#nav a:hover { background-position: -70px 0; }  /**All this code controls how the menu reacts to rollovers**/
#nav a.selected {background-position: -70px 0; }
#nav a:active { background-position: 0 0; }
#thome a  { background: url(genericblog-images/home.jpg) top left no-repeat; }
#tabout a { background: url(genericblog-images/about.jpg) top left no-repeat; }
#tcontact a { background: url(genericblog-images/contact.jpg) top left no-repeat;   }

/*End Menu Code*/

#title, #content {
border-left: #635631 2px solid;
border-right: #635631 2px solid;
}
#title {
background: url(genericblog-images/titlebar.jpg) no-repeat;
height: 30px;
}
#content{
background: #e0f587;
min-height:100%;
height:auto;
width:600px;
margin-left:auto;/* center it*/
margin-right:auto;/* center it*/
position:relative;
text-align:left;
}
* html #content{ /**Don't change this**/
height:100%;
width:600px;/* box model hack for ie5.+*/
w\idth:600px
}

#leftbar {
width: 420px;
padding-left: 20px;
float: left;
}
#leftbar p {
padding-top: 10px;
padding-bottom: 5px;
}
#rightbar {
width: 150px;
float: right;
}
.toph2 {  /** This shouldn't have to be changed!**/
padding-top: 35px;
}
#rightbar p:hover {
color: #a28a71;
text-decoration: underline;
}
#footer {
background: url(genericblog-images/footer.png) no-repeat;
width:100%;
position:relative;
bottom:0;
left:0;
height:80px;
padding-bottom: 30px;
}
#footer p {
padding-top: 5px;
color: #FFF;
}
#footer a {
color: #e0f587;
}
#clearfooter{clear:both;height:80px;width:100%} /** Don't touch or the site will die**/
div>p {margin:0}

</style>


<!--[if IE]>
<style>
#nav {
bottom: 0px;
}
</style>
<![endif]-->
</head>
<body>
<div id="wrapper">
  <div id="header">
    <h1>Generic Blog</h1>
    <ul id="nav" class="fc">
      <li id="thome"><a href="http://www.free-css.com/" class="selected"></a></li>
      <li id="tabout"><a href="http://www.free-css.com/"></a></li>
      <li id="tcontact"><a href="http://www.free-css.com/"></a></li>
    </ul>
  </div>
  <div id="title">
    <form action="#">
      <input type="text" maxlength="30" size="15"/>
      <img src="genericblog-images/searchbutton.png" border="0" height="29" width="19" class="searchbutton" alt="" />
    </form>
  </div>
  <div id="minHeight"></div>
  <!-- Safari hack -->
  <div id="content">
    <div id="leftbar">
      <!-- Main content goes here! -->
      <h3>December 2nd, 2006</h3>
      <h2>Generic Blog Is Finished</h2>
      <p>Welcome to my new theme, Generic Blog!  There really isn't much to it, just a basic blog template that's pretty much good for anything.  My goal in this template/theme was to create a "generic" looking blog that anyone could use.  So, in that essence I hope that you all can understand my coding and can use this theme!  Also, when you do finish editing this theme, please leave the footer link leading to my portfolio on the bottom, thanks.  Finally, if you have any questions or need something clarified, just email me at my <a href="http://www.free-css.com/">site</a></p>
      <p>Phasellus cursus egestas nibh. Nunc congue odio vel tortor. Quisque rutrum viverra nulla. Praesent mollis, neque vel consectetuer tempus, eros massa mattis enim, at feugiat mauris dui et nisi. Pellentesque non lacus. Nulla tincidunt magna non tellus. Quisque faucibus facilisis justo. Etiam quis quam. Nulla non nisl porttitor metus scelerisque imperdiet. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Mauris quis risus non odio luctus vehicula. Ut ligula massa, congue sit amet, suscipit a, mattis at, pede. Integer tellus. Duis at urna ac orci feugiat lobortis. Vestibulum pulvinar. In varius, lorem vitae convallis luctus, neque nisl feugiat justo, vel sollicitudin augue purus eu lectus.
        
        Nulla dictum justo in magna. Mauris quam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi et nisl. Fusce non magna id sapien aliquet pretium. Nunc tempus sodales nulla. Donec hendrerit, nisi ut malesuada aliquet, lectus lorem lacinia nisl, ac posuere purus orci eget diam. Maecenas eu nisi nec elit elementum tristique. Curabitur eros ipsum, lacinia tincidunt, mollis eu, mattis non, eros. Suspendisse eget nibh ac felis ornare mollis. Pellentesque vel velit sed nisl consequat rutrum. Sed in sem quis erat tincidunt pretium. Donec ultricies dictum felis. Sed sit amet enim. Phasellus vulputate faucibus nisi. Praesent facilisis luctus ipsum. Aenean leo odio, pellentesque ac, egestas et, pharetra vitae, erat. Etiam porttitor purus id massa. Curabitur accumsan vestibulum est. Ut malesuada.
        
        Ut nisi nibh, porta id, rhoncus in, porttitor non, nunc. Ut porttitor ante et arcu feugiat vestibulum. Phasellus non quam sit amet purus molestie venenatis. Nullam fringilla fringilla augue. Mauris aliquam, urna nec porttitor mollis, quam augue semper sapien, in ultrices enim lacus nec tellus. In quam turpis, malesuada interdum, vehicula sit amet, aliquam sed, tellus. Phasellus sapien est, pulvinar id, dapibus tincidunt, viverra at, mi. Aenean semper congue tortor. Proin id pede quis metus facilisis accumsan. Duis adipiscing odio ac tellus. Nam hendrerit orci.
        
        Phasellus nec arcu vel ante blandit tincidunt. Integer quam. Duis semper pretium enim. Vivamus ac odio sed purus elementum sagittis. Nunc ut mauris nec eros pulvinar venenatis. Quisque ornare. Morbi quis odio. Aenean non tortor. Vestibulum et neque. Sed in enim et turpis tristique vestibulum. Nunc adipiscing. Suspendisse potenti. Sed est justo, posuere at, nonummy vel, auctor id, nisi. In consectetuer, nibh id commodo auctor, tortor lacus tempus arcu, nec congue odio dolor sed massa. Nullam libero mauris, fringilla et, rutrum ac, blandit et, felis. Curabitur et nisi. Nunc condimentum condimentum elit. Nam auctor pellentesque libero. </p>
    </div>
    <div id="rightbar">
      <!-- Menu stuff is here-->
      <h2 class="toph2">Catagories</h2>
      <p>Testing</p>
      <p>Business</p>
      <p>Personal</p>
      <h2>Blogroll</h2>
      <p>Me</p>
      <p>Wordpress</p>
    </div>
    <div id="clearfooter"></div>
  </div>
  <div id="footer">
    <p>Powered By A CMS</p>
    <p><a href="http://www.thinkpoint.org">Theme By Eric Huang</a></p>
  </div>
</div>
</body>
</html>

   
    
    
    
  








Related examples in the same category

1.blog-style
2.blogger
3.bloggersgreen
4.blogging
5.blogsmith
6.blog_division
7.blog_graphic_design
8.christines-blog
9.chilli-blog
10.baronsblog
11.dkblog
12.metamorph_wordpress
13.design-blog
14.my_dog_spot
15.orange-blog
16.paper-blog
17.personal
18.personalwebsite
19.slash-blog
20.your-blog
21.ntechblog
22.oldenglishblog
23.paint-blog
24.spotlightblog
25.theragblog
26.tilersblog
27.intrablog
28.miniblog
29.happyblog
30.Day by day blog
31.Blog by date
32.Blog layout