sitemaxx.tr.gg
  Css'de Dikey Menü Yapımı
 
Bu dersimiz'de dikey (vertical) menü yapımını anlatacağım.. 

Öncelikle bir liste oluşturuyoruz ve menümüzdeki yazılara link veriyoruz. Liste kodlarımızı menümüzün nerede gözükmesini istiyorsak o kısma ekleyeceğiz. 

Liste kodlarımız:
 
Kod:
<ul id="menu"> 
    <li><a href="Site Adresi">Ana Sayfa</a></li> 
    <li><a href="Site Adresi">Forum</a></li> 
</ul>


Kod:
<ul id="menu">

bu kodumuz ise menünün css ile eşleşmesini sağlar. Listemizde id'in adı ne ise css'de de öyle olmalıdır. 

Kod:
<li><a href="Site Adresi">Ana Sayfa</a></li>

<li> deneme </li> kodlarını arttırdıkça menüdeki eleman sayımız da artar... 

Şimdi ise menümüze güzel bir görünüm getirmek için css kodlarını ayarlıcaz. Css kodları css design bölümüme eklenmelidir.
 

#menu li { 
Menümüz üstteki kod gibi başlamalı. Listemiz'de id'e ne ad verdiyseniz css'de de o isim olmalı. Menümüze değerleri verdikten sonra } bu parantez işareti ile kapatmayı unutmuyoruz.. : ) Ayrıca her değerimizin sonuna ; bu işareti ekliyoruz.. Aşağıda menüye değişik değerler vermek için kodlar yazdım. Bu kodlar inceleyerek hayal gücünüze göre bir menü yapabilirsiniz. 

background: url(resim urlsi) left center no-repeat; : Bu kod ile menümüzün sol tarafına bir resim koyabiliriz. 
list-style:none; : Bu kod listemizin solundaki yuvarlak noktaları kaldırır. 

Çeşitli renklendirme gibi kodlara internetten ulaşabilirsiniz..
 
 
  sitemaxx.tr.gg  
 
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol