slash-blog : Blog « Templates « HTML / CSS

HTML / CSS » Templates » Blog 
slash-blog
  

<!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>Slash Blog</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type='text/css'>
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/

body {
  margin: 20px 0 0 0;
  padding: 0;
  background: #FFFFFF url(slash-blog-images/img01.gifrepeat-x;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  color: #203C36;
}

form {
  margin: 0;
  padding: 0;
}

fieldset {
  margin: 0;
  padding: 0;
  border: none;
}

legend {
  display: none;
}

input, textarea {
  padding: 2px 5px;
  border: 1px solid #B8E0D7;
  font: normal 1em Arial, Helvetica, sans-serif;
  color: #203C36;
}

h1, h2, h3 {
  text-transform: lowercase;
  color: #203C36;
}

h1 {
  letter-spacing: -1px;
  font-size: 3em;
}

h2 {
  font-size: 2em;
}

h3 {
  font-size: 1em;
}

p, ul, ol {
  margin-bottom: 1.6em;
  line-height: 180%;
}

{
}

blockquote {
  font-style: italic;
}

ul {
}

ol {
}

{
  color: #7AB9AB;
}

a:hover {
  text-decoration: none;
}

small {
}

hr {
  display: none;
}

img {
  border: none;
}

img.left {
  float: left;
  margin: 0 15px 0 0;
}

img.right {
  float: left;
  margin: 0 0 0 15px;
}

/* Header */

#header {
  width: 960px;
  height: 80px;
  margin: auto;
  background: url(slash-blog-images/img02.jpg);
}

#header h1 {
  margin: 0;
  padding: 15px 0 0 20px;
  letter-spacing: normal;
  font-size: 1em;
  color: #FFFFFF;
}

#header h1 a {
  text-decoration: none;
  color: #FFFFFF;
}

#header h1 a:hover {
  text-decoration: underline;
}

#header b {
  display: block;
  letter-spacing: -2px;
  font-size: 2.4em;
}

/* Search */

#search {
  float: right;
  width: 180px;
  padding-top: 30px;
}

#searchfield {
  width: 150px;
}

#searchsubmit {
  display: none;
}

/* Page */

#page {
  width: 900px;
  margin: auto;
  padding: 40px 30px;
  background: url(slash-blog-images/img03.jpgno-repeat;
}

/* Content */

#content {
  float: left;
  width: 600px;
}

.post {
}

.post .date {
  margin: 0;
  line-height: normal;
  font-size: .8em;
  color: #999999;
}

.post .title, .post .meta {
  display: inline;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
  font: normal 1.6em "Arial Black", Arial, Helvetica, sans-serif;
}

.post .title {
}

.post .meta {
  padding-left: 10px;
  color: #DDDDDD;
}

.post .meta a {
  color: #DDDDDD;
}

.post .links {
  padding: 5px 10px;
  background: #F8F8F8;
  border-top: 1px solid #EEEEEE;
  border-bottom: 1px solid #EEEEEE;
  text-align: right;
  font-weight: bold;
}

.post .entry {
  clear: both;
  margin-bottom: 50px;
}

/* Sidebar */

#sidebar {
  float: right;
  width: 240px;
  background: url(slash-blog-images/img04.jpgrepeat-y;
}

#sidebar ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

#sidebar li {
  background: url(slash-blog-images/img05.jpgno-repeat;
}

#sidebar li ul {
  padding: 20px 20px 60px 20px;
  background: url(slash-blog-images/img06.jpgno-repeat left bottom;
}

#sidebar li li {
  padding: 0;
  background: url(slash-blog-images/spacer.gif);
  color: #FFFFFF;
}

#sidebar h2 {
  margin: 0;
  padding: 20px 20px 0 20px;
  text-transform: uppercase;
  font-family: "Arial Black", Arial, Helvetica, sans-serif;
  font-size: .8em;
  color: #FFFFFF;
}

#sidebar a {
  color: #FFFFFF;
}

/* Footer */

#footer {
  clear: both;
  padding: 40px 0;
  background: #696B60 url(slash-blog-images/img07.gifrepeat-x;
}

#footer p {
  margin: 0;
  text-align: center;
  color: #999999;
}

#footer a {
  color: #999999;
}

</style>


</head>
<body>
<div id="header">
  <form id="search" method="get" action="http://www.free-css.com/">
    <fieldset>
    <legend>Search</legend>
    <input id="searchfield" type="text" name="s" value="" />
    <input id="searchsubmit" type="submit" value="Search" />
    </fieldset>
  </form>
  <h1><a href="http://www.free-css.com/">SlashBlog</a> / <a target="_blank" href="http://www.freecsstemplates.org/"><b>By Free CSS Templates</b></a></h1>
</div>
<div id="page">
  <div id="content">
    <div class="post">
      <h2 class="title">Welcome to Our Website!</h2>
      <p class="meta"><small>Posted on August 13th, 2007 by <a href="http://www.free-css.com/">admin</a> and filed under <a href="http://www.free-css.com/">Uncategorized</a>.</small></p>
      <p class="links">&raquo; <a href="http://www.free-css.com/" class="comments">Comments</a> &nbsp;&nbsp; &raquo; <a href="http://www.free-css.com/" class="more">Read More</a></p>
      <div class="entry">
        <p><strong>SlashBlog</strong> is a free template from <a target="_blank" href="http://www.freecsstemplates.org/">Free CSS Templates</a> released under a <a target="_blank" href="http://creativecommons.org/licenses/by/2.5/">Creative Commons Attribution 2.5 License</a>. You"re free to use it for both commercial or personal use. I only ask that you link back to <a target="_blank" href="http://www.freecsstemplates.org/">my site</a> in some way. <em>Enjoy :)</em></p>
      </div>
    </div>
    <div class="post">
      <h2 class="title">Common Tag Examples</h2>
      <p class="meta"><small>Posted on August 13th, 2007 by <a href="http://www.free-css.com/">admin</a> and filed under <a href="http://www.free-css.com/">Uncategorized</a>.</small></p>
      <p class="links">&raquo; <a href="http://www.free-css.com/" class="comments">Comments</a> &nbsp;&nbsp; &raquo; <a href="http://www.free-css.com/" class="more">Read More</a></p>
      <div class="entry">
        <blockquote>
          <p>&#8220;A paragraph enclosed in <code>&lt;blockquote&gt;&lt;/blockquote&gt;</code> HTML tags.&#8221;</p>
        </blockquote>
        <h3>A Header Three</h3>
        <p>Quisque dictum integer nisl risus, sagittis convallis, rutrum id, congue, and nibh:</p>
        <ul>
          <li>Pellentesque quis elit non lectus gravida blandit.</li>
          <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
          <li>Phasellus nec erat sit amet nibh pellentesque congue.</li>
          <li>Cras vitae metus aliquam risus pellentesque pharetra.</li>
          <li>Maecenas vitae orci vitae tellus feugiat eleifend. </li>
        </ul>
      </div>
    </div>
  </div>
  <div id="sidebar">
    <ul>
      <li>
        <h2>Categories</h2>
        <ul>
          <li><a href="http://www.free-css.com/">Etiam Rhoncus</a></li>
          <li><a href="http://www.free-css.com/">Donec Dictum</a></li>
          <li><a href="http://www.free-css.com/">Integer Gravida</a></li>
          <li><a href="http://www.free-css.com/">Etiam Posuere</a></li>
          <li><a href="http://www.free-css.com/">Mauris Vulputate</a></li>
        </ul>
      </li>
      <li>
        <h2>Archives</h2>
        <ul>
          <li><a href="http://www.free-css.com/">August 2007</a> (13)</li>
          <li><a href="http://www.free-css.com/">July 2007</a> (31)</li>
          <li><a href="http://www.free-css.com/">June 2007</a> (30)</li>
          <li><a href="http://www.free-css.com/">May 2007</a> (31)</li>
          <li><a href="http://www.free-css.com/">April 2007</a> (30)</li>
          <li><a href="http://www.free-css.com/">March 2007</a> (31)</li>
          <li><a href="http://www.free-css.com/">February 2007</a> (28)</li>
          <li><a href="http://www.free-css.com/">January 2007</a> (31)</li>
        </ul>
      </li>
    </ul>
  </div>
</div>
<div id="footer">
  <p id="legal">&copy;2007 All Rights Reserved. | Designed by <a target="_blank" href="http://www.freecsstemplates.org/">Free CSS Templates</a></p>
  <p id="links"><a href="http://www.free-css.com/">Privacy</a> | <a href="http://www.free-css.com/">Terms</a> | <a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional"><abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a> | <a href="http://jigsaw.w3.org/css-validator/check/referer"><abbr title="Cascading Style Sheets">CSS</abbr></a></p>
</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.genericblog
15.my_dog_spot
16.orange-blog
17.paper-blog
18.personal
19.personalwebsite
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
java2s.com  | Contact Us | Privacy Policy
Copyright 2009 - 12 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.