GrafikleN.Tr.Gg

KOYU RENKLİ KİRLİ TEMA

TASARIM ÜSTÜ

<div id="paper_left">
            <div id="paper_right">
            <div id="layout_wrapper">
            <div id="layout_container">
            <div id="layout_content">
            <div id="site_title">
            <h1><a href="#">Grunge Superstar</a></h1>
            <h2>A dirty, monochrome, single-column website template.</h2>
            </div>
            <div id="header_image"></div>
            <div class="navigation">
            <ul>
            <li class="current_page_item"><a href="index.html">Posts page</a></li>
            <li><a href="comments.html">Post comments</a></li>
            <li><a href="page.html">Sample test page</a></li>
            <li><a href="archives.html">Archives</a></li>
            <li><a href="empty.html">Empty page</a></li>
            </ul>
            <div class="clearer"> </div>
            </div>
            
            <div id="main">
            <div class="post">
            <div class="post_top">
            <div class="post_title"><h2><a href="#">HackeR FrienD.Net</a></h2></div>
            <div class="post_date">Jun 13, 2006 by Vulputate</div>
            </div>
            <div class="post_body">

TASARIM ALTI

</div>
            <div class="post_metadata">
            <div class="content">
            Buraya "Bilgi Güçtür, Paylaştıkça Büyür!" gibi sitenizin sloganını  ekleyebilirsiniz.
            </div>
            </div>
            </div>
            </div>
            <div id="bottom">
            <div class="left col3">
            <h2>Tincidunt</h2>
            <ul>
            <li><a href="index.html">consequat molestie</a></li>
            <li><a href="index.html">sem justo</a></li>
            <li><a href="index.html">semper</a></li>
            <li><a href="index.html">magna sed purus</a></li>
            <li><a href="index.html">tincidunt</a></li>
            </ul>
            </div>
            <div class="left col3">
            <h2>Sed purus</h2>
            <ul>
            <li><a href="index.html">sem justo</a></li>
            <li><a href="index.html">magna sed purus</a></li>
            <li><a href="index.html">tincidunt</a></li>
            <li><a href="index.html">semper</a></li>
            <li><a href="index.html">consequat molestie</a></li>
            </ul>
            </div>
            <div class="right col3last">
            <h2>Praesent</h2>
            <ul>
            <li><a href="index.html">semper</a></li>
            <li><a href="index.html">consequat molestie</a></li>
            <li><a href="index.html">magna sed purus</a></li>
            <li><a href="index.html">sem justo</a></li>
            <li><a href="index.html">tincidunt</a></li>
            </ul>
            </div>
            <div class="clearer"> </div>
            </div>
            <div id="footer">
            <div class="left">© 2008 Website name</div>
            <div class="right">Design by <a href="http://arcsin.se/">Arcsin</a> <a href="http://templates.arcsin.se/">Web Templates</a></div>
            <div class="clearer"> </div>
            </div>
            </div>
            </div>
            </div>
            </div>
            </div>

CSS

h1#title{display: none;}
            h2#title span {display: none;}
            div.header{display: none;}
            li.nav_element{list-style-type: none;}
            li.nav_element{display: none;}
            html {
            font-size: 62.5%; /* reset 1em to 10px */
            height: 100%;
            }
            body {
            background: #444 url('http://www.freelayouts.com/preview/6458/img/body.jpg');
            color: #444;
            font: normal 1.2em Verdana,Arial,sans-serif;
            height: 100%;
            padding-bottom: 1px; /* force scrollbars */
            }
            small,.small {font-size: 0.9em;}
            a {
            color: #EEC;
            text-decoration: none;
            }
            a:hover {
            color: #FFA;
            text-decoration: underline;
            }
            p {padding: 0.2em 0 1.2em;}
            blockquote, code {
            background: #4A4A4A;
            border: 1px solid #333;
            color: #BBB;
            display: block;
            margin-bottom: 12px;
            }
            code {
            font: normal 0.9em Verdana,sans-serif;
            line-height: 1.5em;
            padding: 8px 14px;
            }
            blockquote {
            background: #4A4A4A url('http://www.freelayouts.com/preview/6458/img/quote.gif') no-repeat left top;
            padding: 6px 14px 6px 44px;
            }
            blockquote p {padding: 0.5em 0;}
            h1 {font: normal 2em Georgia,sans-serif;}
            h2 {font: normal 1.6em Georgia,sans-serif;}
            h3 {font: normal 1.4em Georgia,sans-serif;}
            h4 {font: bold 1em Georgia,sans-serif;}
            h1, h2, h3, h4 {margin-bottom: 5px;}
            #paper_left {
            background: url('http://www.freelayouts.com/preview/6458/img/paper_left.gif') no-repeat left top;
            margin: 0 auto;
            padding-bottom: 34px;
            width: 778px;
            }
            #paper_right {
            background: url('http://www.freelayouts.com/preview/6458/img/paper_right.gif') no-repeat right bottom;
            }
            #layout_wrapper {
            background: #50504A url('http://www.freelayouts.com/preview/6458/img/grain_dark.gif');
            margin: 0 auto;
            width: 736px;
            }
            #layout_container {padding: 8px;}
            #layout_content {border: 1px solid #333;}
            #header_image {
            height: 160px;
            background: #222 url('http://www.freelayouts.com/preview/6458/img/header.jpg') no-repeat;
            border-bottom: 1px solid #222;
            border-top: 1px solid #111;
            }
            #site_title {
            background: #222;
            padding: 12px 20px;
            }
            #site_title h1 	{
            color: #EED;
            font: normal 2em Georgia,sans-serif;
            margin: 0 0 5px;
            }
            #site_title h2 {
            color: #BFBFB6;
            font: normal 1.1em sans-serif;
            margin: 0;
            }
            .navigation {
            background: #353535 url('http://www.freelayouts.com/preview/6458/img/navigation.jpg') repeat-x;
            border-bottom: 1px solid #222;
            border-top: 1px solid #555;
            }
            .navigation ul {display: inline; margin: 0;}
            .navigation ul li {
            border-right: 1px solid #303030;
            float: left;
            list-style: none;
            }
            .navigation a {
            color: #AAA;
            display: block;
            font: bold 1em Verdana,sans-serif;
            padding: 12px 14px;
            text-decoration: none;
            }
            .navigation a:hover {
            background: #444;
            color: #E5E5D5;
            text-decoration: none;
            }
            .navigation li.current_page_item a {
            background: none;
            color: #EEE;
            }
            /* Sub navigation */
            #subnav a {
            padding: 10px;
            font-size: 0.9em;
            }
            #main {
            background: #4A4A4A;
            color: #CCC;
            }
            #bottom {
            background: #222;
            border-bottom: 1px solid #1A1A1A;
            border-top: 1px solid #2A2A2A;
            color: #AAA;
            padding: 16px;
            }
            #bottom ul li {
            border-bottom: 1px solid #303030;
            }
            #bottom ul li a {
            color: #777;
            display: block;
            padding: 4px 6px;
            }
            #bottom ul li a:hover {
            background: #2A2A2A;
            color: #FFC;
            text-decoration: none;
            }
            /* Tag cloud */
            #tag_cloud a {color: #777;}
            #tag_cloud a:hover {color: #FFC;}
            #footer {
            background: #2A2A2A;
            border-bottom: 1px solid #1A1A1A;
            border-top: 1px solid #333;
            color: #888;
            font-size: 0.9em;
            padding: 10px 12px;
            }
            #footer a {color: #AAA;}
            #footer .right,#footer .right a {color: #555;}
            #footer a:hover {color: #BBB;}
            .left {float: left;}
            .right {float: right;}
            .clear,.clearer {clear: both;}
            .clearer,.block {
            display: block;
            line-height: 0;
            font-size: 0;
            }
            .clearer {height: 0;}
            .col3, .col3last {width: 31%; margin-right: 3%;}
            .col3last {margin-right: 0;}
            img.bordered {padding: 3px; background: #666;}
            /
            .tleft {text-align: left;}
            .tcenter {text-align: center;}
            .tright {text-align: right;}
            .vtop {vertical-align: top;}
            span.comment {background: url('http://www.freelayouts.com/preview/6458/img/icon_comment.gif') no-repeat left center; padding-left: 18px;}
            .label {
            background: #222 url('http://www.freelayouts.com/preview/6458/img/post_top.gif') repeat-x left top;
            border-bottom: 2px solid #555;
            color: #BBB;
            margin: 0;
            padding: 0.5em 0.8em 0.6em;
            }
            /* Margin, padding, width, height */
            .ptb10 {padding: 10px 0;}
            .post {
            background: #363636;
            border-bottom: 1px solid #111;
            }
            .post_top {
            background: #222 url('http://www.freelayouts.com/preview/6458/img/post_top.gif') repeat-x left top;
            border-bottom: 4px solid #777;
            border-top: 1px solid #3A3A3A;
            padding: 10px 16px 13px;
            }
            .post_title h2 {
            font-size: 2em;
            margin: 0;
            padding: 0;
            }
            .post_body {
            background: url('http://www.freelayouts.com/preview/6458/img/post_body.jpg') no-repeat left top;
            border-top: 1px solid #333;
            padding: 16px 16px 0;
            }
            .post_metadata {padding: 10px;}
            .post_metadata .content {
            background: #424242;
            color: #999;
            font-size: 0.9em;
            padding: 10px 12px;
            }
            .post_metadata a {color: #BBB;}
            .post_metadata a:hover {color: #DDD;}
            .post_body ul, .post_body ol {margin: 0 0 1em 1.5em;}
            .post_body ul {list-style: disc;}
            .post_body ol {list-style: decimal;}
            form {margin: 0; padding: 0;}
            table.search {
            border-collapse: collapse;
            width: 250px;
            }
            table.search td {vertical-align: top;}
            .comment_gravatar {width: 48px;}
            .comment_gravatar img {
            background: #666;
            border: 1px solid #444;
            padding: 2px;
            }
            .comment_author {
            color: #EEE;
            padding-top: 2px;
            }
            .nicelist {padding: 0;}
            .nicelist ol {margin: 0;}
            .nicelist ol li {
            border-bottom: 1px solid #333;
            border-top: 1px solid #505050;
            list-style: none;
            padding: 8px 10px 1px;
            }
            .nicelist ol li:first-child {border-top: none;}
            .nicelist li.alt {background: #444;}
            .nicelist .body {padding-top: 5px;}
            .nicelist .date {
            color: #999;
            font-size: 0.9em;
            padding-top: 4px;
            }
            .nicelist .date a {
            color: #BBB;
            text-decoration: none;
            }
            .nicelist .date a:hover {text-decoration: underline;}
            /
            .archive_title {font: normal 1.4em sans-serif;}
            .archive_title a {text-decoration: none;}
            .archive_title a:hover {text-decoration: underline;}
            .archive_postinfo {padding-bottom: 6px;}
            .pagenavigation {
            background: #555;
            border-top: 1px solid #444;
            font-size: 0.9em;
            padding: 7px 8px 9px;
            }
            .pagenavigation a {
            color: #CCC;
            text-decoration: none;
            }
            .pagenavigation a:hover {
            color: #FFF;
            text-decoration: underline;
            }

Kategoriler

Tasarım

Grafiklen

Www.Grafiklen.TR.GG

KOYU RENKLİ KİRLİ TEMA

İletişim