Forum'da ara:
Ara


« Önceki başlık :: Sonraki başlık »  
Yazar Mesaj
Mesaj12.03.2009, 15:10 (UTC)    
Mesaj konusu: Şu T.Üstü Ve T.Altı ayarlarmısınız?

Şu T.Üstü Ve T.Altı ayarlarmısınız?

İNDEX KODU:::

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

Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License

Name       : WidgetLike
Description: A two-column, fixed-width design featuring black content area background.
Version    : 1.0
Released   : 20081016

-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>WidgetLike by Free CSS Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="bg1">
   <div id="header">
      <h1><a href="#">WidgetLike<sup>1.0</sup></a></h1>
      <h2>By <a href="http://www.nodethirtythree.com/">NodeThirtyThree</a> + <a href="http://www.freecsstemplates.org/">FreeCSSTemplates</a></h2>
   </div>
   <!-- end #header -->
</div>
<!-- end #bg1 -->
<div id="bg2">
   <div id="header2">
      <div id="menu">
         <ul>
            <li><a href="#">Photos</a></li>
            <li><a href="#">Portfolio</a></li>
            <li><a href="#">Friends</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
         </ul>
      </div>
      <!-- end #menu -->
      <div id="search">
         <form method="get" action="#">
            <fieldset>
            <input type="text" name="q" value="search keywords" id="q" class="text" />
            <input type="submit" value="Search" class="button" />
            </fieldset>
         </form>
      </div>
      <!-- end #search -->
   </div>
   <!-- end #header2 -->
</div>
<!-- end #bg2 -->
<div id="bg3">
   <div id="bg4">
      <div id="bg5">
         <div id="page">
            <div id="content">
               <div class="post">
                  <div class="title">
                     <h2><a href="#">Lorem ipsum dolor</a></h2>
                     <p>10.14.08</p>
                  </div>
                  <div class="entry"> <img src="images/img01.jpg" alt="" width="150" height="102" class="left" />
                     <p>Widgetlike is a free template by <a href="http://www.nodethirtythree.com/">NodeThirtyThree</a> and <a href="http://www.freecsstemplates.org/">Free CSS Templates</a> released under a <a href="#">Creative Commons Attribution 2.5 License</a>. The photo to the left is from <a href="http://www.pdphoto.org/">PDPhoto.org</a>. You're free to use this template for both commercial or personal use. I only ask that you link back to <a href="http://www.nodethirtythree.com/">my site</a> in some way. Note: This is also available as a <a href="http://www.freewpthemes.net/preview/widgetlike">WordPress theme</a>.</p>
                  </div>
                  <div class="meta">
                     <p class="credit">Posted by <a href="#">Someone</a> on October 14, 2008</p>
                     <p class="links"><a href="#" class="comments">Comments (18)</a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="#" class="more">Read more</a></p>
                  </div>
               </div>
               <div class="post">
                  <div class="title">
                     <h2><a href="#">Blandit veroeros</a></h2>
                     <p>10.11.08</p>
                  </div>
                  <div class="entry">
                     <p>Sed vel quam. Vestibulum pellentesque. Morbi sit amet magna ac lacus dapibus interdum. Donec pede nisl, gravida iaculis, auctor vitae, bibendum sit amet, mauris. Cras adipiscing libero et risus. Donec rutrum tempus massa. Proin at mauris <a href="#">sed elit venenatis</a> porttitor. Morbi quam nisl, fringilla quis, sagittis nec, adipiscing at, elit. Maecenas sed sem sit amet lectus mattis molestie. Integer quis eros lorem ipsum dolor sit amet veroeros consequat.</p>
                  </div>
                  <div class="meta">
                     <p class="credit">Posted by <a href="#">Someone</a> on October 11, 2008</p>
                     <p class="links"><a href="#" class="comments">Comments (18)</a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="#" class="more">Read more</a></p>
                  </div>
               </div>
            </div>
            <!-- end #content -->
            <div id="sidebar">
               <ul>
                  <li>
                     <h2>Tempus aliquam</h2>
                     <p>Sed vel quam. Vestibulum pellentesque. Morbi sit amet magna ac lacus dapibus interdum. Donec pede nisl, gravida iaculis, auctor vitae, bibendum sit amet aliquam. <a href="#">Read more&hellip;</a></p>
                  </li>
                  <li>
                     <h2>Ipsum sed interdum</h2>
                     <ul>
                        <li><a href="#">Sed vel quam vestibulum</a></li>
                        <li><a href="#">Pellentesque morbi sit veroeros</a></li>
                        <li><a href="#">Magna interdum donec pede</a></li>
                        <li><a href="#">Nisl gravida iaculis auctor vitae</a></li>
                        <li><a href="#">Bibendum sit amet mauris cras</a></li>
                        <li><a href="#">Adipiscing libero et risus donec</a></li>
                        <li><a href="#">Venenatis porttitor morbi quam</a></li>
                     </ul>
                  </li>
               </ul>
            </div>
            <!-- end #sidebar -->
            <div style="clear: both; height: 40px;">&nbsp;</div>
         </div>
         <!-- end #page -->
      </div>
   </div>
</div>
<!-- end #bg3 -->
<div id="footer">
   <p>(c) 2008 Sitename.com. Design by <a href="http://www.nodethirtythree.com/">nodeThirtyThree</a> + <a href="http://www.freewpthemes.net/">Free CSS Templates</a></p>
</div>
<!-- end #footer -->
</body>
</html>


STYLE KODU::

Kod:
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/

* {
   margin: 0;
   padding: 0;
}

body {
   margin: 0px;
   background: #002F43 url(http://img17.imageshack.us/img17/8141/bg01e.jpg) repeat-x;
   font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
   font-size: 11px;
   color: #B9B9B9;
}

h1, h2, h3 {
   margin-bottom: 1.5em;
}

h1 {
   font-size: 2em;
}

h2 {
   font-size: 1.4em;
}

h3 {
   font-size: 1em;
}

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

ul, ol {
   margin-left: 3em;
}

blockquote {
   margin-left: 3em;
   margin-right: 3em;
}

a {
   color: #8AC800;
}

a:hover {
   text-decoration: none;
}

strong {
   color: #D7D7D7;
}

img.left {
   float: left;
   margin: 5px 25px 0px 0px;
}

img.right {
   float: right;
   margin: 5px 0px 0px 25px;
}

/* Background */

#bg1 {
   background: url(http://img17.imageshack.us/img17/1410/bg02i.jpg) no-repeat center top;
}

#bg2 {
   background: url(http://img17.imageshack.us/img17/3451/bg03.jpg) no-repeat center top;
}

#bg3 {
   background: url(http://img17.imageshack.us/img17/4882/bg04.jpg) repeat-y center top;
}

#bg4 {
   background: url(http://img17.imageshack.us/img17/2195/bg05.jpg) no-repeat center top;
}

#bg5 {
   background: url(http://img17.imageshack.us/img17/9107/bg06.jpg) no-repeat center bottom;
}

/* Header */

#header {
   width: 900px;
   height: 145px;
   margin: 0px auto;
   text-transform: lowercase;
   color: #FFFFFF;
}

#header h1 {
   float: left;
   margin: 0px;
   padding: 70px 0px 0px 25px;
   font-size: 40px;
}

#header h1 sup {
   font-weight: normal;
}

#header h2 {
   float: right;
   margin: 0px;
   padding: 95px 25px 0px 0px;
   font-size: 14px;
}

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

/* Header2 */

#header2 {
   width: 900px;
   height: 88px;
   margin: 0px auto;
}

/* Menu */

#menu {
   float: left;
}

#menu ul {
   margin: 0px;
   padding: 34px 0px 0px 0px;
   list-style: none;
   text-transform: lowercase;
}

#menu li {
   float: left;
}

#menu a {
   padding-left: 50px;
   text-decoration: none;
   font-size: 16px;
   font-weight: bold;
   color: #FFFFFF;
}

/* Search */

#search {
   float: right;
}

#search form {
   margin: 0px;
   padding: 35px 80px 0px 0px;
}

#search fieldset {
   margin: 0px;
   padding: 0px;
   border: none;
}

#search input.text {
   width: 160px;
   background: none;
   border: none;
   font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
   color: #AEC38B;
}

#search input.button {
   display: none;
}

/* Page */

#page {
   width: 846px;
   margin: 0px auto;
   padding: 40px 0px 0px 0px;
}

/* Content */

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

.post {
}

.post .title {
   height: 49px;
   background: url(http://img17.imageshack.us/img17/21/img02a.gif) no-repeat;
}

.post .title h2 {
   float: left;
   padding: 12px 0px 0px 24px;
   font-size: 24px;
   text-transform: lowercase;
}

.post .title h2 a {
   text-decoration: none;
   color: #FFFFFF;
}

.post .title h2 a:hover {
   color: #8AC800;
}

.post .title p {
   float: right;
   padding: 12px 24px 0px 0px;
   font-size: 15px;
   font-weight: bold;
   color: #343434;
}

.post .entry {
   padding: 30px 23px 0px 23px;
}

.post .meta {
   height: 70px;
   clear: left;
   margin: 0px 23px;
   padding: 15px 0px 0px 0px;
   border-top: 1px solid #262626;
}

.post .meta .credit {
   float: left;
}

.post .meta .links {
   float: right;
}

.post .meta .links .more {
   padding-left: 17px;
   background: url(http://img17.imageshack.us/img17/1817/img05x.gif) no-repeat left center;
}

.post .meta .links .comments {
   padding-left: 19px;
   background: url(http://img17.imageshack.us/img17/8991/img04z.gif) no-repeat left center;
}

/* Sidebar */

#sidebar {
   float: right;
   width: 236px;
}

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

#sidebar li {
   background: url(http://img17.imageshack.us/img17/3530/img03.gif) no-repeat;
   padding: 0px 23px 20px 23px;
}

#sidebar li ul {
}

#sidebar li li {
   padding: 8px 0px;
   background: none;
   border-bottom: 1px solid #262626;
}

#sidebar h2 {
   margin: 0px;
   padding: 16px 0px 30px 0px;
   text-transform: lowercase;
   font-size: 14px;
   color: #FFFFFF;
}

/* Footer */

#footer {
}

#footer p {
   margin: 0px;
   padding: 20px 0px;
   text-align: center;
   text-transform: lowercase;
   color: #566D77;
}

#footer a {
   color: #8097A1;
}
Mesaj12.03.2009, 16:37 (UTC)    
Mesaj konusu:

İşte Kardeş Kodları Ayırdım.
Tasarım Üstü:
Kod:
<div id="bg1">
   <div id="header">
      <h1><a href="#">WidgetLike<sup>1.0</sup></a></h1>
      <h2>By <a href="http://www.nodethirtythree.com/">NodeThirtyThree</a> + <a href="http://www.freecsstemplates.org/">FreeCSSTemplates</a></h2>
   </div>
   <!-- end #header -->
</div>
<!-- end #bg1 -->
<div id="bg2">
   <div id="header2">
      <div id="menu">
         <ul>
            <li><a href="#">Photos</a></li>
            <li><a href="#">Portfolio</a></li>
            <li><a href="#">Friends</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
         </ul>
      </div>
      <!-- end #menu -->
      <div id="search">
         <form method="get" action="#">
            <fieldset>
            <input type="text" name="q" value="search keywords" id="q" class="text" />
            <input type="submit" value="Search" class="button" />
            </fieldset>
         </form>
      </div>
      <!-- end #search -->
   </div>
   <!-- end #header2 -->
</div>
<!-- end #bg2 -->
<div id="bg3">
   <div id="bg4">
      <div id="bg5">
         <div id="page">
            <div id="content">


Tasarım Altı:
Kod:
<!-- end #content -->
            <div id="sidebar">
               <ul>
                  <li>
                     <h2>Tempus aliquam</h2>
                     <p>Sed vel quam. Vestibulum pellentesque. Morbi sit amet magna ac lacus dapibus interdum. Donec pede nisl, gravida iaculis, auctor vitae, bibendum sit amet aliquam. <a href="#">Read more&hellip;</a></p>
                  </li>
                  <li>
                     <h2>Ipsum sed interdum</h2>
                     <ul>
                        <li><a href="#">Sed vel quam vestibulum</a></li>
                        <li><a href="#">Pellentesque morbi sit veroeros</a></li>
                        <li><a href="#">Magna interdum donec pede</a></li>
                        <li><a href="#">Nisl gravida iaculis auctor vitae</a></li>
                        <li><a href="#">Bibendum sit amet mauris cras</a></li>
                        <li><a href="#">Adipiscing libero et risus donec</a></li>
                        <li><a href="#">Venenatis porttitor morbi quam</a></li>
                     </ul>
                  </li>
               </ul>
            </div>
            <!-- end #sidebar -->
            <div style="clear: both; height: 40px;">&nbsp;</div>
         </div>
         <!-- end #page -->
      </div>
   </div>
</div>
<!-- end #bg3 -->
<div id="footer">
   <p>(c) 2008 Sitename.com. Design by <a href="http://www.nodethirtythree.com/">nodeThirtyThree</a> + <a href="http://www.freewpthemes.net/">Free CSS Templates</a></p>
</div>
<!-- end #footer -->

______________
Mesaj12.03.2009, 18:34 (UTC)    
Mesaj konusu:

Çok saol kardeş çalıştıda kardeş menü gizleme kodu çalışmıyor ne yapmalıyım bu tasarımda...bi kod falan vverirmisin?
Mesaj12.03.2009, 18:37 (UTC)    
Mesaj konusu:

Kod:
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;}
kodu css kutucuguna ekle
______________
Atatürk diyorki ; Beni unutturmak isteyenler olabilir...

Takıldıgınız zor sorunlarmı var burdan çözümünü bulabilirsin tıkla
Önceki mesajları göster:   


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