Aktif-Blog

Cift Menulu Css Tasarim

Merhabalar Arkadaşlar Sizlere Benim Çizdiğim Ve Kodladıgım Çift Menülü Div Tasarımı Sunacagım Güzel Oldu Ancak Arkadaşlar Kullanmak İsteyenler İçin Sağ Altaki Aktif-Blog.Tr.Gg Yazısını Silmemenizi Rica Ediyorum Neyse Konuyu Dağıtmayım Şimdi Tasarımı Kodladım Ve Deneme Siteme Uyarladım Siz Logoyu Değiştireceksiniz Sadece Kendi Sitenize Göre Herşey Hazırdır Arkadaşlar Güle Güle Kullanınız ....


Önizleme :Buraya Tıklayın

Gördüğünüz Gibi Çift Menülü Div Tasarım Kolay Kolay Kodlanmıyor ama Uğraşlarımıza Değecek Bi Tasarım Oldu Ufak Hatalar Olsada...

Kodlara Geçelim

Css Kodları:

table { margin: auto; } 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;} #gövde { margin-left: auto; margin-right: auto; width: 1024px; } #üst { background-image: url(https://img.webme.com/pic/a/aktif-blog/1.png); float: left; height: 208px; width: 1024px; } #solbaslk { float: left; width: 195px; margin-top: 15px; margin-left: 30px; padding-top: 7px; padding-left: 20px; background-image: url(http://cdn1.iconfinder.com/data/icons/oxygen/16x16/actions/format-text-bold.png); background-repeat: no-repeat; background-position: left bottom; } #reklam { float: right; height: 60px; width: 468px; margin-top: 60px; margin-right: 60px; } #ortabaslk { float: none; width: 500px; margin-left: 260px; margin-top: 15px; padding-top: 7px; font-size: 16px; } #sagbaslk { float: right; width: 190px; margin-top: 15px; margin-right: 30px; padding-top: 7px; padding-left: 20px; background-image: url(http://cdn1.iconfinder.com/data/icons/oxygen/16x16/actions/format-text-bold.png); background-repeat: no-repeat; background-position: left bottom; } #tsrmorta { background-image: url(https://img.webme.com/pic/a/aktif-blog/2.png); float: left; height: 376px; width: 1024px; } #solmenü { float: left; height: auto; width: 222px; margin-left: 25px; } #tasarmalt { background-image: url(https://img.webme.com/pic/a/aktif-blog/3.png); float: left; height: 184px; width: 1024px; } #design { height: 100px; width: 600px; margin-top: 30px; margin-left: 30px; text-align: center; padding: 10px; font-size: 18px; } #icerik { float: none; height: auto; width: 508px; margin-left: 260px; } #sagmenü { float: right; width: 211px; margin-right: 28px; padding: 0px; height: auto; } #logo { height: 120px; width: 400px; margin-top: 25px; margin-left: 25px; } .HazirMenu .headerbar{ color: white; margin-bottom: 5px; height: 18px; padding: 8px 0 5px 15px; font-family: Verdana, Geneva, sans-serif; font-size: 12px; font-weight: bold; text-shadow: -2px 1px 1px #E9E9E9; color: #FFFFFF; background-image: url(https://img.webme.com/pic/a/aktif-blog/menbaslk.png); } .HazirMenu ul{ list-style-type: none; margin: 0; padding: 0; margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/ } .HazirMenu ul li{ padding-bottom: 2px; /*bottom spacing between menu items*/ } .HazirMenu ul li a{ color: #A70303; /*custom bullet list image*/ display: block; padding-left: 25px; /*link text is indented 19px*/ text-decoration: none; font-weight: bold; font-family: Verdana, Geneva, sans-serif; font-size: 12px; background-image: url(http://cdn1.iconfinder.com/data/icons/fatcow/16x16/file_extension_htm.png); background-repeat: no-repeat; background-position: left center; padding-top: 3px; padding-right: 0; padding-bottom: 3px; border-bottom-width: 2px; border-bottom-style: dashed; border-bottom-color: #dadada; } .HazirMenu ul li a:visited{ color: #A70303; } .HazirMenu ul li a:hover{ /*hover state CSS*/ color: #000000; background-color: #F3F3F3; } body,td,th { color: #000000; font-weight: bold; } body { background-image: url(http://www.backgroundlabs.com/backgrounds/234.gif); background-attachment: fixed; background-position: center center; } a:link { text-decoration: none; color: #F67E04; }

Tasarım Üstü Kodları :

<div id="gövde"> <div id="üst"> <div id="reklam"><a href="http://aktif-blog.tr.gg" _fcksavedurl="http://aktif-blog.tr.gg"><img src="https://img.webme.com/pic/a/aktif-blog/reklam1lo4.png" _fcksavedurl="https://img.webme.com/pic/a/aktif-blog/reklam1lo4.png" alt="Reklam" width="468" height="60" /></a></div> <div id="logo"><a href="http://aktif-blog.tr.gg" _fcksavedurl="http://aktif-blog.tr.gg"><img src="https://img.webme.com/pic/a/aktif-blog/logo77o.png" _fcksavedurl="https://img.webme.com/pic/a/aktif-blog/logo77o.png" width="400" height="116" /></a></div> <div id="sagbaslk">Başlık</div> <div id="solbaslk">Baslık</div> <div id="ortabaslk">Başlık</div> </div> <div id="tsrmorta"> <div id="solmenü"><div class="HazirMenu"><h3 class="headerbar">Ana Menü</h3> <ul> <li><a href="/ana-sayfa.htm" _fcksavedurl="/ana-sayfa.htm">Ana Sayfa</a></li> <li><a href="/iletisim.htm" _fcksavedurl="/iletisim.htm">İletişim</a></li> <li><a href="/sitene-online-iletisim.htm" _fcksavedurl="/sitene-online-iletisim.htm">Online İletişim</a></li> <li><a href="/hakkinda.htm" _fcksavedurl="/hakkinda.htm">Hakkında</a></li> <li><a href="Katildigim-Toplistler.htm" _fcksavedurl="Katildigim-Toplistler.htm">Katıldıgım Toplistler</a></li> <li><a href="http://aktif-blog.tr.gg/Ziyaretci-defteri.htm" _fcksavedurl="http://aktif-blog.tr.gg/Ziyaretci-defteri.htm">Ziyaretci Defteri</a></li> <li><a href="/siteni-ekle.htm" _fcksavedurl="/siteni-ekle.htm">Toplist Siteni Ekle</a></li> <li><a href="http://aktif-blog.tr.gg/Banner-Degisim.htm" _fcksavedurl="http://aktif-blog.tr.gg/Banner-Degisim.htm">Banner Takas Bölümü</a></li> </ul></div></div> <div id="sagmenü"><div class="HazirMenu"><h3 class="headerbar">Ana Menü</h3> <ul> <li><a href="/ana-sayfa.htm" _fcksavedurl="/ana-sayfa.htm">Ana Sayfa</a></li> <li><a href="/iletisim.htm" _fcksavedurl="/iletisim.htm">İletişim</a></li> <li><a href="/sitene-online-iletisim.htm" _fcksavedurl="/sitene-online-iletisim.htm">Online İletişim</a></li> <li><a href="/hakkinda.htm" _fcksavedurl="/hakkinda.htm">Hakkında</a></li> <li><a href="Katildigim-Toplistler.htm" _fcksavedurl="Katildigim-Toplistler.htm">Katıldıgım Toplistler</a></li> <li><a href="http://aktif-blog.tr.gg/Ziyaretci-defteri.htm" _fcksavedurl="http://aktif-blog.tr.gg/Ziyaretci-defteri.htm">Ziyaretci Defteri</a></li> <li><a href="/siteni-ekle.htm" _fcksavedurl="/siteni-ekle.htm">Toplist Siteni Ekle</a></li> <li><a href="http://aktif-blog.tr.gg/Banner-Degisim.htm" _fcksavedurl="http://aktif-blog.tr.gg/Banner-Degisim.htm">Banner Takas Bölümü</a></li> </ul></div></div> <div id="icerik"><div id="concent">

Tasarım Altı Kodları :