4 Ocak 2015 Pazar

Blogger Beyaz Sarı Renkli Navigasyon Menü



    Blogger tıklayın hazırlanmış Olan bu navigasyon menü HTML tıklayın CSS kullanılarak oluşturulmuştur.Blogger ziyaretinde hazırlanmış Olan Sarı Navigasyon Menüde Görüntüler seklinde akordeon ayarlanmıştır.Bu menü Ile kolay bır sekılde kategorilerden oluşturdugunuz etiket Bağlantılarını ekleyebilirsiniz.

   Eklentiyi kullanmak En çok kolaydır En En JavaScript gedget ekleyerek menümüzü kullanabiliriz AYRICA HTML CSS Kodlarını birbirlerinden ayırarak kodlarınızın icinde kullanabilirsiniz A.Ş ta ..

Blogger Beyaz Sarı Renkli Navigasyon Menü Eklemek İçin;

Kumanda paneli & Co. gt; Konut & Co. gt; Alet ekle & Co. gt; HTML / JavaScript Yolunu takip edin aşağıda ki kodları ekleyerek kaydedin Ettik.
<style type="text/css">
#menu6 ul {
list-style:none;
font-family: "Trebuchet MS", sans-serif;
font-size: 28px;
font-weight: bold;
letter-spacing: -1px;
line-height: 1.1em;
float:left;
clear:both;
margin:20px;
border:4px groove #ffe430;
}
#menu6 ul li{
float:left;
}
#menu6 ul li a{
display:block;
text-decoration:none;
padding:10px 10px 5px 10px;
color:#fff;
background-color:#ffc730;
width:170px;
}
#menu6 ul li a span{
display:block;
}
#menu6 ul li a span.title{
border-bottom:2px solid #ffc730;
}
#menu6 ul li a:hover{
background-color:#fff;
}
#menu6 ul li a:hover span.title{
color:#ffc730;
border-bottom:2px solid #ffe430;
}
#menu6 ul li a span.text{
padding:0px 5px;
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
font-style: italic;
font-weight: normal;
letter-spacing: normal;
line-height: 1.4em;
background-color:#ffc730;
visibility:hidden;
color:#fff;
}
#menu6 ul li a:hover span.text{
visibility:visible;
}
</style>
<div id="menu6">
<ul>
<li><a href="">
<span class="title">About</span>
<span class="text">Who we are</span>
</a>
</li>
<li><a href="">
<span class="title">Portfolio</span>
<span class="text">What we do</span>
</a>
</li>
<li><a href="">
<span class="title">Blog</span>
<span class="text">What we talk about</span>
</a>
</li>
<li><a href="">
<span class="title">Contact</span>
<span class="text">How to get in touch</span>
</a>
</li>
</ul>
</div>

Hiç yorum yok:

Yorum Gönder