Kumpulan Menu Navigasi Blog yang Keren Kumpulan Menu Navigasi Blog yang Keren

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

HI. Kawan-Kawan Kali Ini Saya Akan Mempost Menu Navigasi Blog Yg Keren

Taruh Code CSS Di Bawah Di Atas Code ]]></b:skin>

Style 1. Green Navigasi By : RVmalice




CSS

#greeNav{<br /> height:40px;<br /> margin-top:10px;<br /> }<br /> #greeNav-left{<br /> float:left;<br /> display:inline;<br /> width:100%;<br /> }<br /> #greeNav ul{<br /> position: relative;<br /> overflow: hidden;<br /> padding: 0px 0px 0px 5px;<br /> margin-left: 15px;<br /> margin-top: 1px;<br /> margin-right: 15px;<br /> text-transform: uppercase;<br /> font-size: 20px;<br /> height: 35px;<br /> font-family: 'Squada One', cursive;<br /> background: #292929;<br /> border-left: 5px solid #393939;<br /> border-right: 5px solid #393939;<br /> -moz-border-radius: 20px;<br /> -webkit-border-radius: 20px;<br /> border-radius: 15px;<br /> }<br /> #greeNav ul li{<br /> float:left;<br /> list-style:none;<br /> background:#191919;<br /> height:50px;<br /> margin-left:5px;<br /> width:relative;<br /> -moz-border-radius:5px 0 0 5px;<br /> text-shadow: 0 1px 2px #191919;<br /> }<br /> #greeNav ul li a, #nav ul li a:visited{display:block; color:#ace43f; text-decoration:none; padding:6px;}<br /> #topnav2 ul li a:hover{background-color: #90C529;<br /> color: #191919;<br /> display: block;<br /> height: 50px;<br /> -webkit-transition: all .4s ease-out;<br /> -moz-transition: all .4s ease-out;<br /> -o-transition: all .4s ease-out;<br /> }<br /> #greeNav ul li.home a:hover{background: url("http://i1180.photobucket.com/albums/x403/ilhamganteng99/HOME_32x32-32.png") no-repeat top left;<br /> background-size: 22px;<br /> background-position-y: 5px;<br /> background-color: #191919;<br /> color: #90C529;<br /> display: block;<br /> height: 40px;<br /> -webkit-transition: all .4s ease-out;<br /> -moz-transition: all .4s ease-out;<br /> -o-transition: all .4s ease-out;<br /> }<br /> #greeNav li.home a {<br /> background: url("http://i1180.photobucket.com/albums/x403/ilhamganteng99/HOME_32x32-32_IZ.png") no-repeat top left;<br /> background-position-y: 5px;<br /> padding-left: 27px;<br /> background-size: 23px;<br /> color: #191919;<br /> padding-bottom: 1px;<br /> background-color: #ACE43F;<br /> height: 40px;<br /> }</a>

 Jika Anda Memilih Green Navigasi Maka Ganti Code <div id="navigasi"> Dengan <div id="Greenav">



Style 2 SORA NO OTOSHIMONO Navigasi



#SNOnav {<br /> float: left;<br /> width: 100%;<br /> overflow: hidden;<br /> margin-top: 0px;<br /> border-bottom: 10px solid #A8CABA;<br /> background: rgba(0, 0, 0, 0.4);<br /> padding-top: 5px;<br /> padding-bottom: 5px;<br /> }<br /> #SNOnav li {<br /> float: left;<br /> display: inline;<br /> list-style: none;<br /> margin: auto;<br /> color: #fff<br /> -moz-border-radius: 60px;<br /> -webkit-border-radius: 60px;<br /> border-radius: 60px;<br /> border-left: 9px solid #5D4157;<br /> border-right: 9px solid #5D4157;<br /> text-shadow: 0px 1px 1px black;<br /> width: 81px;<br /> height: 35px;<br /> line-height: 35px;<br /> margin-right: 10px;<br /> text-align: center;<br /> margin-left: 10px;<br /> -webkit-transition: all 0.5s ease-in-out;<br /> -moz-transition: all 0.5s ease-in-out;<br /> }<br /> #SNOnav li:hover {background:#5D4157;}<br /> #SNOnav ul:hover, #nav li a {text-shadow: 0px 3px 1px black;}<br /> #SNOnav li a:hover, #nav li a.selected{<br /> color:#fff;}<br /> #SNOnav li a {<br /> font-size:12px;<br /> font-family: 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif;<br /> text-decoration:none;<br /> text-align: center;color:#fff;<br /> -moz-transition: all 0.5s ease-in-out;<br /> -webkit-transition: all 0.5s ease-in-out;}

  Contoh Jika Anda Memilih Green Navigasi Maka Ganti Code <div id="navigasi"> Dengan <div id="SNOnav">



                         Style 3 #Coming Soon


                         Style 4 #Coming Soon

                        Style 5 #Coming Soon


Sekarang Taroh Code Dibawah Ini Di Bawah Code  </body>

<div id='navigasi'> <ul> <li><a href='http://dj-doo.blogspot.com/'>Home</a></li> <li><a href='http://dj-doo.blogspot.com/'>GuestBook</a></li> <li><a href='http://dj-doo.blogspot.com/'>Exchange</a></li> <li><a href='http://dj-doo.blogspot.com/'>SiteMap</a></li> <li><a href='http://dj-doo.blogspot.com/'>Disclaimer</a></li> <li><a href='http://dj-doo.blogspot.com/'>About</a></li> <li><a href='http://dj-doo.blogspot.com/'>Stats</a></li> </div> </a>

 Ganti Code http://indraahmadrobani.blogspot.com/ Diatas Dengan URL Anda Ganti Juga Nama nya yaitu Home , Guest , Exchange , SiteMap , Disclaimer , About , Stats Dengan Name Yg Anda Inginkan

Jangan Lupa Komentar Ya ^_^

Kumpulan Menu Navigasi Blog yang Keren

Backlinks Please Thanks ^_^

URL

Code For Forum

HTML Code <a href='http://dj-doo.blogspot.com/2012/11/kumpulan-menu-navigasi-blog-yang-keren.html' target='_blank'> Kumpulan Menu Navigasi Blog yang Keren </a>