Blogger Css Menü Sade ve Şık Görünümlü

Merhaba arkadaşlar size bugün kendimde kullandığım sade ve şık css menüyü sizlerle paylaşacağım.

CSS Kodları ;

.berkaymenü{margin:0px auto;width:920px;}
.masmenu{background:url('http://2.bp.blogspot.com/-KQab2UCfNkI/Uc18zejPXEI/AAAAAAAAFJM/mUKgxUYtkB8/s1600/eren.png'); color:#333;font:bold 12px Arial;text-shadow: 1px 1px 1px rgba(255,255,255,0.8);display:inline-block;width:100%;border:1px solid #ccc;box-shadow:0 2px 5px rgba(0,0,0,.1)}
.masmenu ul{width:970px;padding:0;margin:0 auto}
.masmenu li{list-style-type:none;display:inline-block;float:left}
.masmenu li a{border-right:1px solid #ccc;color:#333;display:block;font-size:13px;position:relative;text-decoration:none;padding:11px 13px}
.masmenu li a:hover{background:#333;color:#fff;text-shadow: 1px 1px 1px #111;}
.masmenu li a .sf-sub-indicator{overflow:hidden;position:absolute;text-indent:-9999px}
.masmenu li li a,.masmenu li li a:link,.masmenu li li a:visited{background:#333;border-bottom:1px solid #222;border-right:none;color:#fff;font-size:11px;position:relative;text-transform:none;width:138px;padding:10px 10px;text-shadow: 1px 1px 1px #111}
.divSabit {
height:130px;
width:610px;
}

HTML Kodları (Alanları kendinize göre düzenleyebilirsiniz);

 </div>

      <div class='berkaymenü'>

        <div class='masmenu'>

          <ul class='sf-menu'>

            <li>        

<a href='http://berkaytarlaci.blogspot.com'>

                Ana Sayfa

              </a>

            </li>

            <li>

              <a href='http://berkaytarlaci.blogspot.com/p/hakkmda_5.html'>

                Hakkımda

              </a>

            </li>

            <li>

              
<a href='http://www.berkaytarlaci.blogspot.com/p/iletisim.html'>

               İletişim

              </a>

            </li>

            <li>

            
<a href='http://www.berkaytarlaci.blogspot.com/search/label/Blogger'>

                Blogger

              </a>

            </li>

            <li>

              
<a href='http://www.berkaytarlaci.blogspot.com/search/label/Webmaster'>

                Webmaster

              </a>

            </li>

            <li>

           
<a href='http://www.berkaytarlaci.blogspot.com/search/label/Teknoloji'>

                Teknoloji

              </a>

            </li>

            <li>

            
<a href='http://www.berkaytarlaci.blogspot.com/search/label/Android'>

                Android

             </a>

            </li>

            <li>

       

<a href='http://www.berkaytarlaci.blogspot.com/search/label/S.Medya'>

                Sosyal Medya

              </a>

            </li>

            <li>

    

<a href='http://www.berkaytarlaci.blogspot.com/search/label/Oyunlar'>

              Oyunlar

              </a>

            </li>

            <li>

<a href='http://www.berkaytarlaci.blogspot.com/search/label/HtmlCss'>

                Html - Css

              </a>

            </li>

          </ul>

        </div>

Menüden Görünüm ;

Berkay Tarlacı

berkaytarlaci.blogspot.com