23 Nisan 2010 Cuma

Blogger Ve Blogcu İçin Güzel CSS Menü !

Merhabalar Arkadaşlar Blogcular Ve Blogger için CSS Menü gördüm onu sizlerle paylaşayım dedim
Menü Mausa duyarlı olanlarda hani şu gelince farklı şekillere reklere falan giriyor ya :) İşte onlardan.Bütün Blog Sahipleri bloglarına ekleyebilirler ve kullanabilirler

Evet hazırsanız anlatımı yapmaya başlayalım.Öncelikle
Blogcular Şablon Ayarını düzenle Şablon Htmlsini düzenle Diyerek /style> Kodundan önce
Bloggerlar ise Yerleşim Şablon HTMLsini düzenle widget şablonlarını genişlet dedikten sonra /b:skin> Kodundan önce

#menu-css li {
 display: inline;
 list-style: none;
}
 
#menu-css li a {
 
 /* Border Radius */
 -webkit-border-radius: 15px;
 -moz-border-radius: 15px;
 border-radius: 15px;
 
 /* Border Shadow */
 -webkit-box-shadow: 1px 2px 2px rgba(0,0,0,0.6);
 -moz-box-shadow: 1px 2px 2px rgba(0,0,0,0.6);
 box-shadow: 1px 2px 2px rgba(0,0,0,0.6);
 
 /* Animation (Webkit, Gecko & Mozilla) */
 -webkit-transition-duration: 0.20s;
 -webkit-transition-timing-function: ease-out;
 -moz-transition-duration: 0.20s;
 -moz-transition-timing-function: ease-out; 
 
 color: #ffffff;
 background: rgba(0,0,0,0.2);
 display: inline-block;
 padding: 5px 15px;
 outline: none;
 text-decoration: none;
}
 
 #menu-css li a:hover {
  background: rgba(0,0,0,0.5);
  padding: 5px 25px;
 }
 
 #menu-css li a:active {
  background: rgba(0,0,0,0.1);
  -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
  -moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
  box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
 }
 

kodlarını eklesin ardından
Şablonumuzda istediğimiz yere Artık
Kodlarını Ekleyerek Kullanabilirsiniz.Hyırlı Olsun :)

Hiç yorum yok:

Yorum Gönder

Yorum Almak Bir Site Sahibine Verilecek En Güzel Hediyedir Teşekkür Ederim..