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.gif) repeat-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%;
}
p {
}
blockquote {
font-style: italic;
}
ul {
}
ol {
}
a {
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: 0 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: 0 auto;
padding: 40px 30px;
background: url(slash-blog-images/img03.jpg) no-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.jpg) repeat-y;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar li {
background: url(slash-blog-images/img05.jpg) no-repeat;
}
#sidebar li ul {
padding: 20px 20px 60px 20px;
background: url(slash-blog-images/img06.jpg) no-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.gif) repeat-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">» <a href="http://www.free-css.com/" class="comments">3 Comments</a> » <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">» <a href="http://www.free-css.com/" class="comments">3 Comments</a> » <a href="http://www.free-css.com/" class="more">Read More</a></p>
<div class="entry">
<blockquote>
<p>“A paragraph enclosed in <code><blockquote></blockquote></code> HTML tags.”</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">©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