cara membuat menu navigasi

Langsung aja, kali ini aku mau membuat Menu Navigasi Keren kaya punyaku, silahkan disimak dan dipraktekan..
1. Login Blogger
2. Template-Edit HTML
3. Taruh kode di bawah ini, di atas kode ]]></b:skin> 

.TMMheadt{color:white; font-family:'Black Ops One'; font-size:20px; margin-bottom:5px; text-align:center; text-shadow:2px 2px 3px black,-2px 2px 3px black,-2px -2px 3px black,2px -2px 3px black} #TMMmenu{background:#0d0d0d; border-top:3px solid #494949;border-bottom:3px solid #494949; border-radius:20px 20px 20px 20px; box-shadow:0 0 10px #000; color:white; font-family:'Black Ops One'; font-size:18px; padding:15px 5px; text-align:center; width:906px; margin-bottom:10px; margin-top:10px} #TMMmenu ul a, #TMMmenu ul a:link, #TMMmenu ul a:active, #TMMmenu ul a:visited, #TMMmenu ul .TMMlink{-moz-transition:all 0.3s ease-out 0s; border-color:white; border-radius:50px 50px 50px 50px; color:white; padding:0 8px; text-shadow:2px 2px 2px #000, -2px 2px 2px #000, -2px -2px 2px #000, 2px -2px 2px #000;} #TMMmenu form{border-color:white; border-radius:50px 50px 50px 50px; display:inline} #TMMmenu ul:hover{-webkit-transition: all 0.6s ease-in-out;-moz-transition: all 0.6s ease-in-out;border-left: 3px solid #d82900;border-right: 3px solid #d82900;list-style: none;} #TMMmenu ul{list-style:none outside none; margin:0; padding:0} #TMMmenu ul li{display:inline; margin:0; padding:5px 0} #TMMmenu ul li:hover a, #TMMmenu ul li:hover .TMMlink{color:black; text-shadow:2px 2px 2px #d82900, -2px 2px 2px #d82900, -2px -2px 2px #d82900, 2px -2px 2px #d82900;} #TMMmenu ul li:hover form{-moz-transition:all 0.5s ease-out 0s}

3. Taruh kode di bawah ini, di bawah kode <div id='header-wrapper'>

 <div id='TMMmenu'><ul><li><a href='http://aryx-world.blogspot.com/' title='Home'>&#9830;Home&#9830;</a></li><li><a class='tooltip' href='http://www.facebook.com/groups/DeezClan/' title=':DeezClan'>&#9830;:DeezClan&#9830;</a></li><li><a class='tooltip' href='/2012/07/disclaimer.html' title='Disclaimer'>&#9830;Disclaimer&#9830;</a></li><li><a class='tooltip' href='/2012/06/my-banner.html' title='My Banner'>&#9830;My Banner&#9830;</a></li></ul></div>

 4. Jangan di simpan dulu, tapi di pratinjau dulu :D 

sumber  :  http://altecdz.blogspot.com/2012/12/buat-menu-navigasi-keren.html

Artikel Terkait: