CSS TASARIM

[volkan]

TASARIM ÜSTÜNDEDKİ KOD

Kod:

<div id="wrapper">
   <div id="header">
      <h1>COASTAL NIGHTS</h1>
      <h3>FREE CSS TEMPLATE BY MEDIAUP</h3>
   </div>
   <div id="topnavi">
      <ul>
         <li class="select"><a href="#">HOME</a></li>
         <li class="norm"><a href="#">SERVICES</a></li>
         <li class="norm"><a href="#">PRODUCTS</a></li>
         <li class="norm"><a href="#">STRATEGY</a></li>
         <li class="norm"><a href="#">PARTNERS</a></li>
         <li class="norm"><a href="#">ABOUT US</a></li>
         <li class="norm"><a href="#">CONTACT</a></li>
      </ul>
   </div>
   <div id="headimg"> </div>
   <div id="bodybox">
      <div id="subnavi">
         <h2>Home</h2>
         <ul>
            <li class="select"><a href="#">Sidebar Link</a></li>
            <li class="norm"><a href="#">Sidebar Link</a></li>
            <li class="norm"><a href="#">Sidebar Link</a></li>
            <li class="norm"><a href="#">Sidebar Link</a></li>
            <li class="norm"><a href="#">Sidebar Link</a></li>
            <li class="norm"><a href="#">Sidebar Link</a></li>
         </ul>
      </div>
      <div id="content">



TASARIM ALTINDAKİ KOD

Kod:

</div>
   </div>
   <div id="footer">
       Copyright 2008 yourname.com. All Rights Reserved. Coastal Nights is a free template by
      <a rel="nofollow" href="http://www.mediaup.de">Webdesign</a> MediaUp</div>
   <div class="cleaner"></div>
</div>

CSS KOD BÖLÜMÜNE EKLENECEK BÖLÜM

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;}
/* CSS Document */

body {
   margin-top:29px;
   text-align:center;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/body_bg.jpg');
   background-color:#000000;
   font-family:Tahoma, sans-serif;
   font-size:11px;
   color:#eeeeee;
}

#wrapper {
   width:702px;
   margin:0 auto;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/wrapper_bg.jpg');
   text-align:left;
}

#header {
   float:left;
   width:702px;
   height:83px;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/header_bg.jpg');
}

h1 {
   margin:0px;
   padding:0px;
   font-family:Arial, Helvetica, sans-serif;
   font-weight:bold;
   font-size:30px;
   color:#ff5700;
}

h2 {
   margin:0px;
   padding:0px;
   font-family:Arial, Helvetica, sans-serif;
   font-weight:bold;
   font-size:18px;
   color:#ff5700;
}

h3 {
   margin:0px;
   padding:0px;
   font-family:Tahoma, sans-serif;
   font-size:11px;
   color:#cccccc;
   font-weight:normal;
}

.cleaner {
   clear:both;
   height:0px;
   font-size:0px;
   border:none;
   margin:0; padding:0;
   background:transparent;
}

#header h1 {
   margin-top:25px;
   margin-left:25px;
}

#header h3 {
   margin-top:-6px;
   margin-left:25px;
}

#topnavi {
   float:left;
   width:702px;
   height:29px;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/topnavi_bg.jpg');
}

#topnavi ul {
   margin:0px;
   padding:0px;
   list-style-type:none;
   margin-left:8px;
   margin-right:8px;
}

#topnavi ul li.norm {
   float:left;
   height:29px;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/topbutton_norm.jpg');
   background-position:right;
}

#topnavi ul li.select {
   float:left;
   height:29px;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/topbutton_select.jpg');
   background-position:right;
}

#topnavi ul li.norm a {
   display:block;
   padding-right:24px;
   padding-left:24px;
   line-height:28px;
   font-family:Arial, Helvetica, sans-serif;
   font-weight:bold;
   color:#FFFFFF;
   font-size:10px;
   text-decoration:none;
}

#topnavi ul li.select a {
   display:block;
   padding-right:24px;
   padding-left:24px;
   line-height:28px;
   font-family:Arial, Helvetica, sans-serif;
   font-weight:bold;
   color:#FFFFFF;
   font-size:10px;
   text-decoration:none;
}

#topnavi ul li.norm a:hover {
   display:block;
   padding-right:24px;
   padding-left:24px;
   line-height:28px;
   font-family:Arial, Helvetica, sans-serif;
   font-weight:bold;
   color:#FFFFFF;
   font-size:10px;
   text-decoration:underline;
}

#topnavi ul li.select a:hover {
   display:block;
   padding-right:24px;
   padding-left:24px;
   line-height:28px;
   font-family:Arial, Helvetica, sans-serif;
   font-weight:bold;
   color:#FFFFFF;
   font-size:10px;
   text-decoration:underline;
}

#headimg {
   float:left;
   width:702px;
   height:147px;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/headimg_bg.jpg');
}

#bodybox {
   float:left;
   width:702px;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/bodybox_bg.jpg');
   background-repeat:no-repeat;
}

#subnavi {
   float:left;
   display:inline;
   margin-left:18px;
   margin-top:2px;
   padding-top:26px;
   padding-bottom:26px;
   width:180px;
   background-color:#1e1d1e;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/subnavi_bg.jpg');
   background-position:bottom;
}

#subnavi ul {
   margin:0px;
   padding:0px;
   list-style-type:none;
   margin-left:13px;
   margin-right:13px;
}

#subnavi ul li.norm, #subnavi ul li.select {
   height:24px;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/subnavi_bg.jpg');
}

#subnavi ul li.norm a {
   display:block;
   line-height:23px;
   padding-left:20px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11px;
   color:#eeeeee;
   text-decoration:none;
}

#subnavi ul li.norm a:hover {
   display:block;
   line-height:23px;
   padding-left:20px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11px;
   color:#eeeeee;
   text-decoration:underline;
}

#subnavi ul li.select a {
   display:block;
   line-height:23px;
   padding-left:20px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11px;
   color:#ff5700;
   text-decoration:none;
}

#subnavi ul li.select a:hover {
   display:block;
   line-height:23px;
   padding-left:20px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11px;
   color:#ff5700;
   text-decoration:underline;
}

#subnavi h2 {
   margin-left:17px;
   margin-bottom:6px;
}

#content {
   float:left;
   display:inline;
   width:440px;
   margin-left:27px;
   margin-right:27px;
   padding-top:26px;
   padding-bottom:26px;
}

#content p {
   color:#eeeeee;
}

#content ul {
   list-style-image:url('http://80.190.202.79/pic/m/meleklerindiyari/list_li.gif')
}

#content a {
   color:#ff5700;
   text-decoration:none;
}

#content img.pic {
   float:right;
   margin-left:8px;
   margin-bottom:8px;
   border:1px solid #333333;
   padding:2px;
}

#content a:hover {
   color:#ff5700;
   text-decoration:underline;
}

#footer {
   float:left;
   width:702px;
   height:49px;
   background-image:url('http://80.190.202.79/pic/m/meleklerindiyari/footer_bg.jpg');
   text-align:center;
   color:#cccccc;
   font-family:Tahoma, sans-serif;
   font-size:9px;
   line-height:42px;
}

#footer a {
   color:#cccccc;
   text-decoration:none;
}

#footer a:hover {
   color:#cccccc;
   text-decoration:underline;
}