Neobux / Katılın- Kazanın

Fikirlerini Paylaş, Sen de Kazanmaya Başla!

Translate

20120915

Blogger’da alternatif bir menü yapımı


Klasik olmayan, yeni ve estetik  bir menu yapmak istiyorsanız
bu alternatifi deneyebilirsiniz.
Su yolu takip edin...



Blogger panelimizin Tasarım > Html’yi Düzenle bölümünü açarak aşağıdaki kodu buluyoruz.
]]></b:skin>
Bu kodun hemen üzerine menümüzün aşağıdaki CSS kodunu ekleyin.
.icmenu {
padding:5px 0;
width:520px;
margin:15px auto;
height:160px;
}
a.icem {
position:relative;
float:left;
font-size:14px;
line-height:14px;
font-family:Tahoma;
text-align:center;
color: #fff;
width: 160px;
padding:73px 0;
background: url(http://1.bp.blogspot.com/-U3AQRBScIG8/UFB03vOswrI/AAAAAAAACIo/ghFtyEM1L-0/s1600/arkamenu2.png) no-repeat 0 -160px;
margin-left:-40px;
z-index:3;
}
a.icem:hover {
background-position:0 0;
z-index:9!important;
}


Ve son olarak menümüzü yerleştirmek istediğimiz yere aşağıdaki kodu ekleyin.
<div class='icmenu'>
<a class='icem' href='#' style='margin-left:0px;'>Anasayfa</a>
<a class='icem' href='#'>Hakkımızda</a>
<a class='icem' href='#'>Arşiv</a>
<a class='icem' href='#'>İletişim</a>
</div>


 DEMO



Hiç yorum yok:

Yorum Gönder

Not: Yalnızca bu blogun üyesi yorum gönderebilir.