Tasarım 5

Poddi Turuncu Design

Açıklama:
Poddi.de.tl 'ye ait olan bu tasarımı
sizlere sunuyorum.

Tasarım Özellikleri

Tasarım İsmi:	»Poddi Design
Kategorisi:	»Css Tasarım
Eklenme:	»03.Tem 2010
Telif Hakkı:	»Osman Talay
Tarayıcılar:	»Opera »Firefox »İ.Explorer »G.Chrome

Tasarımın Üzerindeki Yazı

<div id="design"> <div id="logo"></div> <div   id="slogan"></div> <div style="clear:both;"></div>   <div id="menu_l"></div> <div id="menu"> <div   id="menu_items">  <a href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Ana Sayfa</a><img   src="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   style="vertical-align: middle;">  <a   href="http://www.osmantalay.tr.gg/Hakkimda.htm"   _fcksavedurl="http://www.osmantalay.tr.gg/Hakkimda.htm">HakkImda</a><img   src="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   style="vertical-align: middle;"> <a   href="http://www.osmantalay.tr.gg/Defter.htm"   _fcksavedurl="http://www.osmantalay.tr.gg/Defter.htm">Z.Defterİ</a>   <img src="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   style="vertical-align: middle;"> <a href="http://maxitasarim.tk"   _fcksavedurl="http://maxitasarim.tk">FORUM</a><img   src="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   style="vertical-align: middle;"> <a   href="http://www.osmantalay.tr.gg/Siteni-Ekle.htm"   _fcksavedurl="http://www.osmantalay.tr.gg/Siteni-Ekle.htm">Sİtenİ   Ekle</a><img   src="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   style="vertical-align: middle;"> <a href="http://osmantalay.tr.gg"   _fcksavedurl="http://osmantalay.tr.gg">Eklenecek</a><img   src="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   style="vertical-align: middle;"> <a href="http://osmantalay.tr.gg"   _fcksavedurl="http://osmantalay.tr.gg">Eklenecek</a><img   src="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/menu_trenn.png"   style="vertical-align: middle;"> <a href="http://osmantalay.tr.gg"   _fcksavedurl="http://osmantalay.tr.gg">Eklenecek</a>   </div> </div>  <div id="menu_r"></div>  <div   id="content_top">  </div> <div id="hinweis">   <div   style="width: 100%; float: right; background: none repeat scroll 0% 0%   rgb(255, 234, 189); padding: 3px; text-align: center;">   <b>Sitemizden Haberler:</b> Buraya Ekle   </div></a>  </div>

Tasarımın Altındaki Yazı

<div id="header_container">                 </div>                   <div id="counter"><span>   </span></div>                  <div  id="post_content"></div>                  <div  id="below_content">    <div id="footer">  <div   id="spalten">  <div id="spalte1"> <ul id="foot"> <img   src="https://img.webme.com/pic/o/osmantalay/iconr.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/iconr.png"   style="vertical-align: middle;" alt="" />   <b style="color:   #000;">YARARLI LİNKLER</b> <li><a   href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a></li>    <li><a href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a></li>   <li><a href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a></li>   </ul> </div>  <div id="spalte2"> <ul  id="foot">  <img  src="https://img.webme.com/pic/o/osmantalay/iconr.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/iconr.png"   style="vertical-align: middle;" alt="" />   <b style="color:   #000;">DOST SİTELER</b> <li><a   href="http://themestudio.de/goto.php?ref=2&url=http://www.osmantalay.tr.gg"     _fcksavedurl="http://themestudio.de/goto.php?ref=2&url=http://www.osmantalay.tr.gg"   target="_blank">Yakında</a></li> <li><a   href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg"   target="_blank">Yakında</a></li> <li><a   href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg"   target="_blank">Yakında</a></li>  </ul>   </div>  <div id="spalte3"> <ul id="foot"> <img   src="https://img.webme.com/pic/o/osmantalay/iconr.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/iconr.png"   style="vertical-align: middle;" alt="" />   <b style="color:   #000;">ÖNE ÇIKANLAR</b> <li><a   href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg"   target="_blank">Yakında</a></li> <li><a   href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a></li>   <li><a href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a></li>   </ul> </div>  <div id="spalte4"> <ul  id="foot">  <img  src="https://img.webme.com/pic/o/osmantalay/iconr.png"   _fcksavedurl="https://img.webme.com/pic/o/osmantalay/iconr.png"   style="vertical-align: middle;" alt="" />   <b style="color:   #000;">REKLAMLAR</b> <li><a   href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg"   target="_blank">Yakında</a></li> <li><a   href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg"   target="_blank">Yakında</a></li> <li><a   href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg"   target="_blank">Yakında</a></li> </ul> </div>    </div> </div>  <div  id="content_bottom"></div>     <div id="copy">© Copyright  2010 by Osman Talay | Tüm Hakları  Saklıdır |   <a  href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a>  |    <a href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a>  |    <a href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a>   |     <a href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a>  |    <a href="http://www.osmantalay.tr.gg"   _fcksavedurl="http://www.osmantalay.tr.gg">Yakında</a><a   name="commentform"></a><div>  </div>  <div   id="extraDiv1"><span></span></div>         <div   id="extraDiv2"><span></span></div>         <div   id="extraDiv3"><span></span></div>          <div  id="extraDiv4"><span></span></div>          <div  id="extraDiv5"><span></span></div>           <div  id="extraDiv6"><span></span></div>       </body> </html>

Css Kodu

table {margin-left: auto;margin-right: auto}       h1#title{display:   none;} h2#title span {display: none;} div.header{display: none;}   li.nav_element{list-style-type: none;} li.nav_element   checked_menu{display:none;} li.nav_element subpage{display:none;}   li.nav_element{display:none;} #counter{display: none;}   /*Background*/    body {     background:   url(https://img.webme.com/pic/o/osmantalay/bg.png) repeat;       font-family: arial, sans-serif;     font-size: 0.8em;     padding: 0px;       margin: 0px;}      #bg_top{     background: url(   https://img.webme.com/pic/o/osmantalay/bg_top.png ) repeat-x;     width:   100%;     height: 300px;     position: absolute;     top: 0px;       z-index: -1;}   /*Schriftformatierung*/  p {     line-height: 1.4em;       margin:0;     padding:0 0 5px;     color:#646464;}  h1 {       color:#FE7507;     font-size: 130%;     font-weight: bold;       font-family: Helvetica, Arial,sans-serif;}  h2 {     color:#646464;       font-size:100%;     font-weight: bold;     font-family: Helvetica,   Arial,sans-serif;}  a {     color:#FE7507;       outline-color:-moz-use-text-color;     outline-style:none;       outline-width:medium;     text-decoration:none;}  a:hover {       color:#FDAB4A;     text-decoration:underline;}   * { padding: 0; margin:   0; }  ul, li{     list-style-type: none;}  hr{     height: 1px;       border: 0px solid #e0e0e0;     background-color: #e0e0e0;     margin:   5px;     margin-left: 0px;     margin-right: 0px;}      img{     border:   0px;}   /*BILD-/VIDEOPOSITION*/  .left{     float: left;     padding:   8px 8px 8px 0px;}  .right{     float: right;     padding: 0px 0px 8px   8px;}  .center{     display: block;     text-align: center;     margin: 0   auto;}  .left_video{     float: left;     margin: 0px auto;       background-image:  none;     width: 323px;     height: 267px;       padding: 22px;}  .right_video{     float: right;     margin: 0px auto;       background-image:  none;     width: 323px;     height: 267px;       padding: 22px;}   /*Design*/  #design{     width: 911px;     margin:   10px auto;}   /*Header*/  #logo{     background:   url(https://img.webme.com/pic/o/osmantalay/logotopd.gif) no-repeat;       width: 350px;     height: 90px;     margin-bottom: 10px;     float:   left;}   /*CONTENT*/  #content{     width: 836px;     min-height: 450px;       background:   url(https://img.webme.com/pic/o/osmantalay/content_bg.png) repeat-y;       float: left;     padding-top: 10px;     padding-right: 30px;       padding-bottom: 10px;     padding-left: 30px;     color: #646464;}    #content_top{     background:   url(https://img.webme.com/pic/o/osmantalay/content_top.png) no-repeat;       width: 896px;     height: 19px;     float:left;}   #content_bottom{       background:   url(https://img.webme.com/pic/o/osmantalay/content_bottom.png) no-repeat;       width: 896px;     height: 19px;     float: left;}  #content_box{       background: #eeeeee;     border: 1px solid #DDDDDD;     padding:  10px;      margin: 10px;}  #hinweis{     width: 836px;     background:   url(https://img.webme.com/pic/o/osmantalay/content_bg.png) repeat-y;       float: left;;     padding-right: 30px;     padding-left: 30px;       padding-top: 5px;     color: #646464;} #hinweis a{     color: #646464;}    /*SUBPAGE*/         /*MENU*/  #menu {       background-image:url(https://img.webme.com/pic/o/osmantalay/menu_bg.png);       height:38px;     width: 870px;     float: left;     margin-bottom:   10px;}  #menu_r {           background-image:url(https://img.webme.com/pic/o/osmantalay/menu_r.png);       width:13px;     height:38px;     display:inline;     float:left;}    #menu_l {       background-image:url(https://img.webme.com/pic/o/osmantalay/menu_l.png);       width:13px;     height:38px;     display:inline;     float:left;       margin-left: 4px;}  #menu_items {     float: left;     height:28px;       display:inline;     padding-top: 10px;}  #menu_items a:link,   #menu_items a:visited, #menu_items a:hover {     font-family:Arial,   Helvetica, Verdana, sans-serif;     font-weight:bold;     font-size:   11px;     text-transform: uppercase;     text-decoration:none;       color:#fff;     margin:0px 10px;}  #menu_items a:hover {color: #3b3b3b;}     /*Foot-Menu*/      #footer{     width: 896px;     height: 112px;       background: url(https://img.webme.com/pic/o/osmantalay/content_bg.png)   repeat-y;     float: left;}      #spalten{margin: 0px auto; width:   781px}  #spalte1, #spalte2, #spalte3, #spalte4{     width: 184px;       height: 90px;     float: left;     border-right: 1px solid #bbbbbb;       border-top: 1px solid #bbbbbb;     border-bottom: 1px solid #bbbbbb;       padding: 5px;     background: #e5e5e5;}      #spalte1{border-left:  1px  solid #bbbbbb;}  #foot li a {     display: block;     width: 170px;       padding: 5px;     padding-top: 3px;     padding-bottom: 3px;       background: transparent;     border-bottom: 1px solid #bbbbbb;       text-decoration: none;     font-weight: normal;     color: #646464;       font-family:Arial, Helvetica, Verdana, sans-serif;     margin: 0px;}    #foot li a:hover {     background: #ffeabd;     color: #000;}             /*Tableiste*/  #tabs{     width: 33px;     height: 444px;       margin-top: 25px;     margin-bottom: 25px;     margin-left: -18px;       float: right;}  #tabs li{clear: both;}   /*Footer*/  #copy{     float:   left;     color: #fff;     font-size: 11px;     width: 700px;       margin-left: 10px;     margin-bottom: 20px;}      }  /*MEDIATHEK*/   #mediamenu li a {     display: block;     width: 150px;     padding:   5px;     padding-top: 3px;     padding-bottom: 3px;     background:   transparent;     border-bottom: 1px solid #e0e0e0;     text-decoration:   none;     font-family:Arial, Helvetica, Verdana, sans-serif;      margin:  0px;}  #mediamenu li a:hover {     background: #eeeeee;}     #mediamenuhead{     width: 174px;     height: 16px;     background:   url(https://img.webme.com/pic/o/osmantalay/medianav.png);     padding:   3px;}  #mediamenuhead h2{     color: #646464;} #mediamenuhead h2:hover{       color: #000000;}  #mediapre{     clear:both;     width: 630px;       padding: 5px;     min-height: 135px;     border-top: 1px solid #e0e0e0;       border-bottom: 1px solid #e0e0e0;}  #mediapre:hover{      background:  #eeeeee;}  /*WEITERES*/   input,textarea{     border: 1px  solid  #dddddd;     background: #eeeeee;     padding: 3px;}   input:focus,textarea:focus{border: 1px solid #bbbbbb;}    input[type="submit"]{cursor: pointer;}   input[type="submit"]:hover{border: 1px solid #bbbbbb;}  /*BOXEN*/     #vorschau{ width: 140px; padding: 5px; border: 1px solid  #dddddd;   background: #eeeeee; float: left; margin: 2px; text-align: center;}    #videovorschau{ width: 144px; padding: 5px; border: 1px solid  #dddddd;   background: #eeeeee; float: left; margin: 2px; text-align: center;}    #vorschau:hover, #videovorschau:hover, #minivorschau:hover{ background:   #ffeabd;}  #minivorschau{ width: 105px; padding: 5px; border: 1px solid    #dddddd; background: #eeeeee; float: left; margin: 2px; text-align:   center;}  #boardticker{     text-decoration: none;     padding: 2px;       border-bottom: 1px solid #dddddd;}   #boardticker:hover{       background: #eeeeee;}

WebScripts

Tasarım 5

Poddi Turuncu Design

Tasarım Özellikleri