Ali Mengü | Kişisel Web Sayfasi

Yatay Açilir CSS Menu Nasıl Yapilir?

Herkese Merhabalar,Uzun zaman sonra yeni bir konuyla karşınızdayım.

Soru ; Yatay açılır CSS Menu Nasıl Yapılır.Dersini Sitenize Eklerseniz Sevinirm.
Cevap ; Daha önce anlatmış olduğum Yatay CSS Menu Yapimi Dersimi İzlediyseniz ve anladiysaniz bu derste pek zorluk çekiceğinizi sanmiyorum.
Derste Kullanilan Özellikleri Bilmiyorum Diyorsaniz?
Margin ve Padding Nedir? Nasıl Kullanilir?
CSS de Border Özelliği

---

PART1
PART2
PART3

---

Ayrintili Görünüm İçin Tıklayınız
<style type="text/css">
<!--
#menu {
    height: 39px;
    background-image: url(http://alimengu.tk/alimengu.png);
    border: 1px solid #000000;
    text-align:left;
}
#menu ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}
#menu li {
    float: left;
}
#menu a {
    display: block;
    width: 120px;
    height: 27px;
    text-align: center;
    padding-top: 12px;
    font-family: Tahoma;
    text-decoration: none;
    color: #000000;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #000000;
}
#menu a:hover {
    background-image: url(http://alimengu.tk/alimengu2.png);
}
#menu ul li ul {
    position: absolute;
    width: 150px;
    display: none;
}
#menu ul li:hover ul {
    display: block;
}
#menu ul li ul li a {
    width: 180px;
    height: 20px;
    padding-top: 5px;
    text-align: left;
    padding-left: 2px;
    background-color: #F27423;
    border: 1px solid #000000;
    font-size: 14px;
}
#menu ul li ul li a:hover {
    background-image: url(http://alimengu.tk/alimengu3.png);
}
-->
</style>
<div id="menu">
<ul>
    <li><a href="#">Anasayfa</a></li>
    <li><a href="#">Hakkimda</a></li>
    <li><a href="#">Z.Defteri</a></li>
<li><a href="#">Tasarimlar</a>
<ul>
 <li><a href="#">CSS Tasarimlar</a></li>
 <li><a href="#">Tablo Tasarimlar</a></li>
 <li><a href="#">Hazir Tasarimlar</a></li>
</ul>
</li>
    <li><a href="#">Iletisim</a></li>
  </ul>
</div>


---

Bu sayfa hakkındaki yorumlar: Yorumu gönderen: gizem, 15.04.2012, 10:13 (UTC): teşekkürler www.yuklex.blogspot.com Yorumu gönderen: sanane, 16.02.2012, 07:47 (UTC): siyene Yorumu gönderen:: 17.11.2011, 15:33 (UTC) (locked user) Bende yaptım ellerine sağlık Ali Yorumu gönderen:: 30.10.2011, 18:13 (UTC) mehmetpkcn Kapalı Teşekkür ediyorum yaptım bende Yorumu gönderen:: 12.09.2011, 09:39 (UTC) smdgr Kapalı çok güzel ve açıklayıcı bir anlatım olmuş Yorumu gönderen:: 31.08.2011, 22:32 (UTC) web-blogger Kapalı bu isteği bn yapmıştım sitene eklediin için teşekkürler ali .) Yorumu gönderen:: 30.08.2011, 21:45 (UTC) alimengu Kapalı yorumlariniz için teşekkür ederim Yorumu gönderen:: 30.08.2011, 13:22 (UTC) (locked user) süper yha eline sağlık wallaha en kısa zamanda bende yapıcam kendime ait Yorumu gönderen: WwebW, 30.08.2011, 10:34 (UTC): İzlemedim ama izleyeceğim.Çok güzel bir menü olmus.Tebrikler.

Bu sayfa hakkında yorum ekle:

İsminiz:
Mesajın: