Forum'da ara:
Ara


« Önceki başlık :: Sonraki başlık »  
Yazar Mesaj
Mesaj15.02.2012, 16:00 (UTC)    
Mesaj konusu: Red blog tasarim

üst
Kod:
<div id="templatemo_top_wrapper">

   <div id="templatemo_top">

   

        <div id="templatemo_menu">

                   

            <ul>

                <li><a href="index.html" class="current">Home</a></li>

                <li><a href="portfolio.html">Portfolio</a></li>

                <li><a href="services.html">Services</a></li>

                <li><a href="contact.html">Contact Us</a></li>

            </ul>       

       

        </div> <!-- end of templatemo_menu -->

       

        <div id="twitter">

           <a href="#">follow us <br />

           on twitter</a>

        </div>

       

  </div>

</div>



<div id="templatemo_header_wrapper">

   <div id="templatemo_header">

   

       <div id="site_title">

            <h1><a href="http://www.templatemo.com" target="_parent"><strong>Red Blog</strong><span>Free Blog Template in HTML CSS</span></a></h1>

        </div>

   

    </div>

</div>



<div id="templatemo_main_wrapper">

   <div id="templatemo_main">

      <div id="templatemo_main_top">

       

           <div id="templatemo_content">

       

          <div class="post_section">

           

               <div class="post_date">

                   30<span>Nov</span>

               </div>

<div class="post_content">

               

                    <h2><a href="blog_post.html">Aliquam lorem ante dapibus</a></h2>



                    <strong>Author:</strong> Steven | <strong>Category:</strong> <a href="#">PSD</a>, <a href="#">Templates</a>

                   

                    <a href="http://www.templatemo.com/page/1" target="_parent"><img src="images/templatemo_image_01.jpg" alt="image" /></a>

                   

                    <p><a href="http://www.templatemo.com" target="_parent">Red Blog </a> is a free HTML/CSS layout from templatemo.com for everyone. There are total 5 pages included (blog, <a href="blog_post.html">full  post</a>, services, portfolio, contact) Quisque at ante sit amet erat laoreet fermentum. Quisque nec nisl.</p>

                    <p>Fusce lacinia orci at nisi. Suspendisse at nisi nec diam pretium tincidunt. Ut vitae felis eu lectus ultrices varius. Aliquam lacus turpis, dapibus eget, tincidunt eu, lobortis et, magna. Integer pellentesque dignissim diam. </p>

                    <p><a href="blog_post.html">24 Comments</a> | <a href="blog_post.html">Continue reading...</a>                </p>

</div>

                <div class="cleaner"></div>

            </div>

               

            <div class="post_section">

                   


ALT
Kod:
<div class="post_date">

                   24<span>Oct</span>

               </div>

               

                <div class="post_content">

                   <h2><a href="blog_post.html">Lorem ipsum dolor sit amet</a></h2>

                   <strong>Author:</strong> Templatemo <strong>Category:</strong> <a href="#">HTML</a>, <a href="#">CSS</a>

               

                   <a href="http://www.templatemo.com/page/2" target="_parent"><img src="images/templatemo_image_02.jpg" alt="image" /></a>

               

                   <p>Credits go to <a href="http://www.photovaco.com" target="_blank">free photos</a> for photos, <a href="http://www.smashingmagazine.com/2008/09/23/practika-a-free-icon-set/" target="_blank">Smashing Magazine</a> for icons and <a href="http://www.brusheezy.com" target="_blank">Nose-Meat</a> and <a href="http://www.brusheezy.com" target="_blank">FortuneGfx</a> for brushes. Phasellus cursus lobortis arcu. Donec scelerisque. Integer ultrices. Vivamus eu tortor. Phasellus tempus, justo et laoreet varius, odio mi ultrices libero, nec faucibus dui felis eu dui. Cras ac odio ac mi imperdiet sollicitudin.</p>

                    <a href="blog_post.html">58 Comments</a> | <a href="blog_post.html">Continue reading...</a>

           

               </div>

                <div class="cleaner"></div>

            </div>

       

            </div>

           

         

          <div id="templatemo_sidebar">

               

                <h4>Categories</h4>

                <ul class="templatemo_list">

                    <li><a href="index.html">Praesent adipiscing</a></li>

                    <li><a href="index.html">Duis sed justo</a></li>

                    <li><a href="index.html">Mauris vulputate</a></li>

                    <li><a href="index.html">Nam auctor</a></li>

                    <li><a href="index.html">Aliquam quam</a></li>

                </ul>

               

                <div class="cleaner_h40"></div>

               

                <h4>Friends</h4>

                <ul class="templatemo_list">

                    <li><a href="http://www.templatemo.com" target="_parent">Free CSS Templates</a></li>

                    <li><a href="http://www.flashmo.com" target="_parent">Flash Templates</a></li>

                    <li><a href="http://www.templatemo.com/page/1" target="_parent">Free Blog Themes</a></li>

                    <li><a href="http://www.webdesignmo.com/blog" target="_parent">Web Design Blog</a></li>

                    <li><a href="http://www.koflash.com" target="_parent">Flash Websites Gallery</a></li>

                    <li><a href="#">Vestibulum laoreet</a></li>

                    <li><a href="#">Nullam nec mi enim</a></li>

                    <li><a href="#">Aliquam quam nulla</a></li>

                </ul>

               

                <div id="ads">

                   <a href="#"><img src="images/templatemo_200x100_banner.jpg" alt="banner 1" /></a>

                   

                    <a href="#"><img src="images/templatemo_200x100_banner.jpg" alt="banner 2" /></a>

                </div>

               

            </div>

       

           <div class="cleaner"></div>

           

        </div>

       

    </div>

   

    <div id="templatemo_main_bottom"></div>

   

</div>



<div id="templatemo_footer">



    Copyright © 2048 <a href="index.html">Your Company Name</a> |

    Designed by <a href="http://www.templatemo.com" target="_parent">Free CSS Templates</a> |

    Validate <a href="http://validator.w3.org/check?uri=referer">XHTML</a> &

    <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>

   

</div>


cSS

Kod:
/*
Credit: http://www.templatemo.com
*/

body {
   margin: 0px;
   padding: 0px;
   color: #666;
   font-family: Georgia, "Times New Roman", Times, serif;
   font-size: 13px;
   line-height:1.5em;
   background-color: #821764;
    background-image:http://img.webme.com/pic/r/reklampaylas/templatemo_body.jpg;
   background-repeat: repeat;
}

a, a:link, a:visited {
   color: #8d1b0f;
}

a:hover {
   color: #006666;
   text-decoration: none;
}

p { margin: 0px; padding: 0 0 10px 0; }
img { border: none; }

h1 { font-size: 40px; font-weight: bold; margin: 0 0 30px 0; padding: 5px 0; color: #000; }
h2 { font-size: 34px; font-weight: normal; line-height: 28px; margin: 0 0 30px 0; padding: 0; color: #4b0f09; }
h3 { font-size: 21px; font-weight: normal; margin: 0 0 20px 0; padding: 0; padding: 0; color: #1da3e9; }
h4 { font-size: 18px; margin: 0 0 20px 0; padding: 0 0 10px 0; color: #e4ff00; border-bottom: 1px dashed #e4ff00; }
h5 { font-size: 16px; margin: 0 0 10px 0; padding: 0; color: #1da3e9;}
h6 { font-size: 14px; margin: 0 0 5px 0; padding: 0; color: #1da3e9;}

.cleaner { clear: both; width: 100%; height: 0px; font-size: 0px;  }
.cleaner_h10 { clear: both; width:100%; height: 10px; }
.cleaner_h20 { clear: both; width:100%; height: 20px; }
.cleaner_h30 { clear: both; width:100%; height: 30px; }
.cleaner_h40 { clear: both; width:100%; height: 40px; }
.cleaner_h50 { clear: both; width:100%; height: 50px; }
.cleaner_h60 { clear: both; width:100%; height: 60px; }

.margin_r30 { margin-right: 30px; }

.vertical_divider { border-right: 1px solid #d9d9d9; }
.horizon_divider {  border-bottom: 1px solid #d9d9d9; }

.float_l {
   float: left;
}

.float_r {
   float: right;
}

.image_wrapper {
   display: inline-block;
   padding: 8px;
   border: 1px solid #999;
   background: #ffffff;
   margin-bottom: 10px;
}
.fl_img {
   float: left;
   margin: 3px 30px 15px 0;
}
.fr_img {
   float: right;
   margin: 3px 0 15px 30px;
}

blockquote { font-style: italic; margin-left: 10px;}
cite { font-weight: bold; }
cite span { color: #8da332; }
em { color: #5d6d1e; }

.templatemo_list {
   margin: 20px 0;
   padding: 0;
   list-style: none;
}

.templatemo_list li {
   background:http://img.webme.com/pic/r/reklampaylas/templatemo_list.png;
   margin:0 0 20px;
   padding: 5px 0 5px 35px;
   line-height: 1em;
}

.templatemo_list li a {
   color: #2f1a1d;
   text-decoration: none;
}

.templatemo_list li a:hover {
   text-decoration: underline;
}

.button a {
   clear: both;
   display: block;
   width: 82px;
   height: 23px;
   padding: 3px 0 0 0;
   margin-top: 15px;
   background: url(images/templatemo_button.png) no-repeat;
   color: #000;
   font-weight: bold;
   text-align: center;
   text-decoration: none;
}

.button a:hover {
   color: #fff;
   background: url(images/templatemo_button_hover.png) no-repeat;
}

#templatemo_top_wrapper {
   width: 100%;
   height: 100px;
   background:urlhttp://img.webme.com/pic/r/reklampaylas/templatemo_menu.jpg;
}

#templatemo_top {
   width: 970px;
   height: 100px;
   margin: 0 auto;
   padding: 0 30px 0 80px;
   background:http://img.webme.com/pic/r/reklampaylas/templatemo_menu.jpg;
}

#templatemo_menu {
   float: left;
   width: 700px;
}

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

#templatemo_menu ul li {
   padding: 0px;
   margin: 0px;
   display: inline;
}

#templatemo_menu ul li a {
   float: left;
   display: block;
   width: 130px;
   height: 50px;
   padding: 17px 10px 0 0;
   margin: 0 30px 0 0 ;
   font-size: 16px;
   text-align: center;
   text-decoration: none;
   color: #6d450f;   
   font-weight: bold;
   outline: none;
}

#templatemo_menu ul li a:hover, #templatemo_menu ul li .current {
   color: #fff;
   background:http://img.webme.com/pic/r/reklampaylas/templatemo_menu_hover.png)
}

#templatemo_top #twitter a {
   float: right;
   display: block;
   width: 100px;
   height: 80px;
   padding: 10px 100px 0 0;
   font-weight: bold;
   color: #382512;
   line-height: 20px;
   text-decoration: none;
   background: url http://img.webme.com/pic/r/reklampaylas/4.png;
}

#templatemo_top #twitter a:hover {
   text-decoration: underline;
}
   

#templatemo_header_wrapper {
   clear: both;
   width: 100%;
   height: 300px;
   background: url http://img.webme.com/pic/r/reklampaylas/templatemo_header.jpg;
}

#templatemo_header {
   width: 920px;
   height: 250px;
   margin: 0 auto;
   padding: 50px 80px 0 80px;
   background: url(images/templatemo_header.jpg) no-repeat top center;
}

#templatemo_header  #site_title {
   float: left;
   width: 500px;
   padding-top: 30px;
   padding-left: 100px;
}

#templatemo_header  #site_title h1 {
   margin: 0;
   padding: 0;
   color: #fff;
}

#templatemo_header  #site_title h1 a {
   margin: 0px;
   padding: 0px;
   font-size: 50px;
   color: #ffef38;
   font-weight: normal;
   text-decoration: none;
}

#templatemo_header  #site_title a span {
   display: block;
   font-size: 16px;
   color: #FFFFFF;
   font-family: Arial, Helvetica, sans-serif;
   font-weight: bold;
   letter-spacing: 2px;
   margin-top: 20px;
   margin-left: 5px;
}

#templatemo_main_wrapper {
   width: 100%;
   background: url(images/templatemo_main.jpg) no-repeat top center;
}

#templatemo_main {
   width: 1080px;
   margin: 0 auto;
    background:url(images/templatemo_content.jpg) center repeat-y;
}

#templatemo_main_top {
   width: 1080px;
   background: url(images/templatemo_main.jpg) no-repeat center top;
}

#templatemo_main_bottom {
   width: 1080px;
   height: 180px;
   margin: 0 auto;
   background: url(images/templatemo_main_bottom.jpg) no-repeat center top;
}

#templatemo_content {
   float: left;
   width: 640px;
   margin: 0 0 0 100px;
}

.post_section {
   clear: both;
   padding-bottom: 30px;
   border-bottom: 1px dashed #CCC;
   margin-bottom: 30px;
}

.post_section .post_date {
   float: left;
   width: 120px;
   height: 90px;
   padding: 38px 15px 0 0;
   text-align: center;
   font-size: 30px;
   color: #FFFFFF;
   font-weight: bold;
   background: url(images/templatemo_date.png) no-repeat top left;
}

.post_section .post_date span {
   display: block;
   color: #FFFFFF;
   font-size: 16px;
   margin-top: 5px;
}

.post_section .post_content {
   float: right;
   width: 490px;
}

.post_section h2  {
   margin: 0;
   padding: 10px 0 10px 0;
   line-height: 30px;
}

.post_section p {
   text-align: justify;
   margin-bottom: 10px;
}

.post_section img {
   clear: both;
   display: block;
   margin: 20px 0;
}

.post_section .comment {
   position: absolute;
   top: -10px;
   right: 0px;
   width: 70px;
   height: 42px;
   text-align: center;
   padding-top: 10px;
   font-size: 16px;
   font-weight: bold;
   background: url(images/templatemo_comment.png) no-repeat;
}

.post_section .comment a {
   color: #333;
   text-decoration: none;
}

.post_section .comment_tab {
   padding: 10px 0;
   margin: 40px 0 20px 0;
   border-bottom: 1px dashed #666;
   font-size: 20px;
   font-weight: bold;
}

#templatemo_rss a{
   float: right;
   display: block;
   width: 190px;
   height: 40px;
   padding: 10px 0 10px 60px;
   margin-bottom: 30px;
   color: #ffa200;
   font-size: 16px;
   font-weight: bold;
   text-decoration: none;
   background: url(images/templatemo_rss.png) left center no-repeat;
}

#templatemo_header #templatemo_rss a:hover {
   color: #fff;
   text-decoration: none;   
}

#templatemo_rss a span {
   font-size: 12px;
   margin-top: 5px;
   letter-spacing: 3px;
}

.comment_tab {
   padding: 10px 0;
   margin: 40px 0 40px 0;
   border-bottom: 1px dashed #666;
   font-size: 20px;
   font-weight: bold;
   color: #1da3e9;
}

#comment_section {
   clear: both;
   margin-bottom: 60px;
   width: 460px;
}

.first_level {
   margin: 0; padding: 0;
}

.comments {
   list-style: none;
}

.comments li { margin-bottom: 10px; list-style:none; }
.comments li .commentbox1 { border: 1px solid #dddbdb;  background: #e7e4e4; }
.comments li .commentbox2 { border: 1px solid #dddddd;  background: #f6f6f6; }
.comments li .comment_box { clear: both; width:100%; padding: 15px;  }
.comment_box .gravatar { float: left; width: 50px; margin-right: 15px; background: #fff; }
.comment_box .gravatar img { margin: 0; width: 50px; height: 50px; }
.comment_box .comment_text { margin: 0 0 0 65px; }

.comment_box .comment_text p { margin: 0; }
.comment_text .comment_author { font-size: 14px; font-weight: bold; color: #1da3e9; margin-bottom: 10px; }
.comment_text .date { font-size: 12px; font-weight: normal; color: #333; padding-left: 10px; }
.comment_text .time { font-size: 12px; font-weight: normal; color: #333; padding-left: 10px; }
.comment_text .reply a { display: block; clear: both; float: right; padding: 1px 10px; height: 24px; text-align: center; background: #3694ab; border: 1px solid #fff; color: #fff; }


#comment_form {
   clear: both;
}

#comment_form h3{
   font-size: 20px;
   border-bottom: 1px dotted #666;
   margin-bottom: 15px;
   padding-bottom: 10px;
}

#comment_form form {
   padding: 20px;
   background-color: #e4e1e1;
   border: 1px solid #d5d3d3;
}

#comment_form textarea {
   background:#FFFFFF none repeat fixed 0 0;
   border: 1px solid #CCC;
   display:block;
   font-size:1.1em;
   height:150px;
   margin-top:5px;
   padding:5px;
   width: 360px;
}

#comment_form .form_row {
   width: 100%;
   margin-bottom: 15px;
}

#comment_form form input {
   margin-top: 5px;
   width: 200px;
   background:#FFFFFF none repeat fixed 0 0;
   border: 1px solid #CCC;
}

#comment_form .submit_btn {
   width: 80px;
}

#gallery {
      width: 600px;
      padding: 40px 0;
   }
   #gallery ul { list-style: none; margin: 0; padding: 0; }
   #gallery ul li {
      float: left;
      display: block;
      padding: 0;
      margin: 0;
      width: 245px;
      padding: 10px;
      background: #f4f1f3;
      border: 1px solid #e0dee0;
      margin: 0 0 30px 30px;
   }
   
   #gallery ul li h5 {
      margin-bottom: 15px;
   }
   
   #gallery ul img {
      width: 245px;
      height: 130px;
      border: none;
      margin-bottom: 10px;
   }

.service_box {
   margin-bottom: 40px;
}

.service_box .left {
   float: left;
   width: 120px;
   height: 120px;
}

.service_box .left img {
   width: 120px;
   height: 120px;
}

.service_box .right {
   float: right;
   width: 500px;
}

.service_box ol li {
   list-style: decimal-leading-zero;
   margin-bottom: 5px;
}

.service_box ol li a {
   color: #058edc;
}

#contact_form form {
   margin: 0px;
   padding: 0px;
}

#contact_form form .input_field {
   width: 350px;
   padding: 6px 0;
   background: #fff;
   border: 1px solid #ccc;
}

#contact_form form label {
   display: block;
   width: 100px;
   margin-right: 10px;
   font-size: 14px;   
}

#contact_form form textarea {
   width: 350px;
   height: 200px;
   background: #fff;
   border: 1px solid #ccc;
}

#contact_form form .submit_btn {
   margin-right: 100px;
   background: #fff;
   border: 1px solid #ccc;
   padding: 5px 15px;
}

#templatemo_sidebar {
   float: right;
   color: #FFF;
   width: 200px;
   margin: 0 80px 0 0;
   padding-top: 30px;
}

#templatemo_sidebar #ads {
   margin-bottom: 30px;
}

#templatemo_sidebar #ads a {
   display: block;
   width: 200px;
   height: 100px;
   margin-bottom: 10px;
}

#templatemo_footer {
   width: 980px;
   margin: 0 auto;
   padding: 0 10px 30px;
   text-align: center;
   color: #fff;
}

#templatemo_footer a {
   color: #fff;
}
Mesaj15.02.2012, 16:10 (UTC)    
Mesaj konusu:

Paylaşım için teşekkürler fakat birde önizleme koysaydınız daha güzel olacaktı...
______________

Arrow Ethical Hacker Arrow Professional Web Designer
Mesaj15.02.2012, 16:26 (UTC)    
Mesaj konusu:

unutmusum kardesım birdaha hep koycam
Mesaj16.02.2012, 11:18 (UTC)    
Mesaj konusu:

Tasarım Paylaşımları:

Alıntı:
Alıntı:
http://www.bedava-sitem.com/forum/viewtopic.php?t=184931
Önceki mesajları göster:   


Powered by phpBB © 2001, 2005 phpBB Group
Türkçe Çeviri: phpBB Türkiye & Erdem Çorapçıoğlu