Show DevBest Basic Blog | HTML Template

BR4DLEY

BR4DLEY

Web Developer
Jan 2, 2012
328
23
Hey Devbest,

Second Release.



Index:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--

Design by TehBradley
Released for free under a Creative Commons Attribution 2.5 License

Title      : Blog
Version    : Null
Released   : Devbest.com - TehBradley
Description: A two-column, fixed-width design for blogs and small websites.

-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Blog - TehBradley from DevBest</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="default.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<!-- start header -->
<div id="header">
    <h1><a href="#">Blog</a></h1>
    <p>By TehBradley</p>
</div>
<!-- end header -->
<!-- star menu -->
<div id="menu">
    <ul>
        <li class="current_page_item"><a href="#">Home</a></li>
        <li><a href="#">Blog</a></li>
        <li><a href="#">Photos</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Contact</a></li>
    </ul>
</div>
<!-- end menu -->
<!-- start page -->
<div id="page">
    <!-- start content -->
    <div id="content">
        <div class="post">
            <div class="title">
                <h2><a href="#">About "Blog"</a></h2>
                <p><small>Posted on August 27th, 2014 by Guest</small></p>
            </div>
            <div class="entry">
                <p>Hello and welcome to this basic Release created by <a href="http://devbest.com/members/tehbradley.10966/">TehBradley</a>, This was released for blogging purposes but feel free to use it for your own use (: I would also like to say that this release can be used by ANYONE! But you cannot re-release it as your own..I thank you for taking the time to check out my release! </p>
            </div>
            <p class="links"> <a href="#" class="more">Read More</a> &nbsp;&nbsp;&nbsp; <a href="#" class="comments">No Comments</a> </p>
        </div>
        <div class="post">
            <div class="title">
                <h2><a href="#">Other</a></h2>
            </div>
            <div class="entry">
                <h3>An H3 Followed by a Blockquote:</h3>
                <blockquote>
                    <p>&#8220;Place Holder&#8221;</p>
                </blockquote>
                <h3>Bulleted List:</h3>
                <ul>
                    <li>Example</li>
                </ul>
                <h3>Numbered List:</h3>
                <ol>
                    <li>Example</li>
                </ol>
            </div>
            <p class="links"> <a href="#" class="more">Read More</a> &nbsp;&nbsp;&nbsp; <a href="#" class="comments">No Comments</a> </p>
        </div>
    </div>
    <!-- end content -->
    <!-- start sidebar -->
    <div id="sidebar">
        <div id="search">
            <h2>Search</h2>
            <form id="searchform" method="get" action="">
                <fieldset>
                <input type="text" name="s" id="s" size="15" value="" />
                <input type="submit" id="x" value="Search" />
                </fieldset>
            </form>
        </div>
        <ul>
            <li id="categories">
                <h2>Categories</h2>
                <ul>
                    <li><a href="#">Normal</a> (0) </li>
                    <li><a href="#">Advanced</a> (0) </li>
                    <li><a href="#">18+ Section<a> (0) </li>
                </ul>
            </li>
            <li>
                <h2>Recent Posts</h2>
                <ul>
                    <li><a href="#">About "Blog"</a></li>
                </ul>
            </li>
        </ul>
    </div>
    <!-- end sidebar -->
    <div id="extra" style="clear: both;">&nbsp;</div>
</div>
<!-- end page -->
<!-- start footer -->
<div id="footer">
    <p class="legal"> &copy;2014 yourdomain.com - Coded By TehBradley of <a href="DevBest.com">DevBest</a>
</div>
<!-- end footer -->
<div align=center><a href="http://www.devbest.com">DevBest</div></body>
</html>


CSS:
Code: 
/*
Released for free under a Creative Commons Attribution 2.5 License
*/

body {
    margin: 0;
    padding: 0;
    background: #FFFFFF url(images/img01.jpg) repeat-x;
    font: 13px Georgia, "Times New Roman", Times, serif;
    color: #000000;
}

form {
    margin: 0;
    padding: 0;
}

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

input, textarea {
    font: normal 1em Georgia, "Times New Roman", Times, serif;
}

h1, h1 a, h2, h2 a, h3, h3 a {
    margin: 0;
    text-decoration: none;
    color: #333333;
}

h1 {
    letter-spacing: -2px;
    font-size: 3.2em;
}

h2 {
    letter-spacing: -1px;
    font-size: 2em;
}

h3 {
    margin-bottom: 1em;
    font-size: 1em;
}

p, ol, ul {
    margin: 0 0 2em 0;
    line-height: 200%;
}

blockquote {
    margin: 0 0 0 2.5em;
    padding-left: 1em;
    border-left: 5px solid #16B1B0;
}

a {
    color: #16B1B0;
}

a:hover {
    text-decoration: none;
}

img {
    border: none;
}

/* Header */

#header {
    width: 770px;
    height: 100px;
    margin: 0 auto;
}

#header h1, #header p {
    margin: 0;
}

#header h1 {
    float: left;
    padding: 34px 0 0 0;
}

#header p {
    float: right;
    padding: 42px 0 0 0;
    font-size: 1.8em;
}

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

/* Menu */

#menu {
    width: 770px;
    height: 65px;
    margin: 0 auto;
    background: url(images/img02.jpg) no-repeat;
}

#menu ul {
    margin: 0;
    padding: 7px 0 0 0;
    list-style: none;
}

#menu li {
    display: inline;
}

#menu a {
    padding-right: 30px;
    text-decoration: none;
    letter-spacing: -1px;
    font-size: 1.2em;
    font-weight: bold;
    color: #333333;
}

#menu a:hover {
    text-decoration: underline;
}

/* Page */

#page {
    width: 770px;
    margin: 0 auto;
    background: url(images/img05.gif);
}

#extra {
    background: url(images/img06.gif) no-repeat left bottom;
}

/* Content */

#content {
    float: left;
    width: 530px;
    background: url(images/img03.gif) no-repeat;
}

.post {
    padding: 40px 40px 0 40px;
}

.post ol, .post ul {
    list-style-position: inside;
}

.post .title {
}

.post .title h2 {
}

.post .title p {
}

.post .title p a {
}

.post .entry {
}

.post .links {
    padding: 2px 20px;
    background: #CDFAFB;
    text-align: right;
}

.post .links a {
    text-decoration: none;
    font-weight: bold;
    color: #0B8785;
}

.post .links a:hover {
    text-decoration: underline;
}

.post .links .more {
}

.post .links .comments {
}

/* Sidebar */

#sidebar {
    float: right;
    width: 240px;
    background: url(images/img04.gif) no-repeat;
}

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

#sidebar li {
}

#sidebar li ul {
    padding: 20px;
}

#sidebar li li {
    font-size: .85em;
}

#sidebar h2 {
    height: 33px;
    padding: 4px 0 0 10px;
    background: url(images/img07.jpg) no-repeat;
    font-size: 1.6em;
}

/* Search */

#searchform {
    padding: 20px;
}

#search h2 {
    background: url(images/img08.jpg) no-repeat;
}

#search #x {
}

#search #s {
    width: 120px;
}

#search br {
}

/* Calendar */

#calendar_wrap {
    padding: 20px 25px 20px 20px;
}

#calendar table {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #16B1B0;
    text-align: center;
}

#calendar thead {
    background: #16B1B0;
    color: #FFFFFF;
}

#calendar tbody td {
    background: #FFFFFF;
    border: 1px solid #BCF8FA;
}

#calendar #prev {
    text-align: left;
}

#calendar #next {
    text-align: right;
}

#calendar tfoot a {
    text-decoration: none;
    font-weight: bold;
}

#calendar #today {
    background: #BCF8FA;
    border: 1px solid #16B1B0;
    font-weight: bold;
    color: #16B1B0
}

/* Footer */

#footer {
    clear: both;
    width: 950px;
    margin: 0 auto;
    padding: 30px 0;
    background: url(images/img11.gif) no-repeat;
}

#footer p {
    margin: 0 0 5px 0;
    text-align: center;
    line-height: normal;
    font-size: .9em;
}

#footer a {
    text-decoration: none;
}


Screenshots:
Index:
You must be registered for see links


Download Link:
You must be registered for see links


Thanks
 
cxdy

cxdy

PHP Developer
Jun 8, 2014
100
27
No search bar styling?
Not a fan of the font. No need for the big ass credit in the top right. Also, why doesn't your header flow with the rest of the content?

3/10 for effort.
 
Magic

Magic

Posting Freak
Oct 11, 2012
1,026
196
I dislike the color scheme, the search bar looks like an ancient artifact and why does the (0) behind the 18+ section look green while the other ones are black.
Also not a fan of the rounded corners.

There is some things to work on if you wanted me to use it, of course there might be others who disagree with my feedback and really like it.
 
BR4DLEY

BR4DLEY

Web Developer
Jan 2, 2012
328
23
cxdy said:
No search bar styling?
Not a fan of the font. No need for the big ass credit in the top right. Also, why doesn't your header flow with the rest of the content?

3/10 for effort.
Click to expand...
Like it says above, its Basic :p
 
Weasel

Weasel

👄 I'd intercept me
Nov 25, 2011
4,135
2,461
TehBradley said:
Whoever uses this can feel free to change it as they please
Click to expand...
They would have to rewrite most of the code. Take some time and study into new HTML tags so you can release a mewer, HTML5 version. And keep it simple qua colorscheme and design.
 

Users who are viewing this thread

Total: 2 (members: 0, guests: 2)
☀️  Switch to Light Theme

Latest posts

Top