Cara Membuat Menu Bar dan Sub Menu Keren Di Blog

Cara Membuat Menu Bar dan Sub Menu Keren Di Blog
Cara Membuat Menu Bar ... Langsung Simak Aja ok..

Ikuti Langkah-Langkah Berikut ini :

    Buka akun blogger Anda.
    Masuk ke menu edit HTML, jangan lupa cantang expand template widget
    Cari kode dibawah ini :

        ]]>

     Pastekan kode dibawah ini, diatas pada kode diatas :

        #container1 {
        width: 960px;
        margin: 0 auto;}
        .menu33{height:40px;border-right:1px solid rgba(255,255,255,0.3);float:left;}a{text-decoration:none;color:#FFFFFF;text-transform:uppercase;font-size:15px;font-weight:bold;}ul{margin:0;padding:10px 10px ;}
        a:link {color:#ffffff;}
        a:hover {color:#ffffff;text-decoration: none;}
        a:visited {color: #FFFDFD;text-decoration: none;}
        ul.menu33 li{list-style:none;float:left;height:40px;text-align:center;background:-webkit-gradient(radial,50% 100%,10,50% 50%,90,from(rgba(31,169,244,1)),to(rgba(0,28,78,1)));background:-moz-radial-gradient(center 80px 45deg,circle cover,rgba(31,169,244,1) 0%,rgba(0,28,78,1) 100%);}
        ul li a{display:block;padding:0 20px;border-left:1px solid rgba(255,255,255,0.1);border-right:1px solid rgba(0,0,0,0.1);text-align:center;line-height:40px;background:-webkit-gradient(linear,left top,left bottom,from(rgb(168,168,168)),to(rgb(69,69,69)));background:-moz-linear-gradient(top,rgb(168,168,168),rgb(69,69,69));-webkit-transition-property:background;-webkit-transition-duration:700ms;-moz-transition-property:background;-moz-transition-duration:700ms;}
        ul li a:hover{background:transparent none;}
        ul[rel=sam1] li a{background:#606060;}
        ul[rel=sam1] li a:hover{background:transparent none;}
        ul li.active a{background:-webkit-gradient(radial,50% 100%,10,50% 50%,90,from(rgba(31,169,244,1)),to(rgba(0,28,78,1)));background:-moz-radial-gradient(center 80px 45deg,circle cover,rgba(31,169,244,1) 0%,rgba(0,28,78,1) 100%);}
       

       

       
• Home

       
• About Me

       
• Menu 1

       
• Menu 2

       
• Menu 3

       
• Menu 4
         
  
         
  • Sub Menu 1
  
         
  • Sub Menu 2
  
         
  
         

       
• Menu 5

       

       

    Keterangan :
    Edit Tulisan Berwarna :
    -Biru dengan alamat yang anda ingin tuju contoh : http://x-vblog31.bblogspot.com
    -Merah Dengan Nama Seperti Home-Hijau Itu adalah Sub Menu. Jika Kalian ingin memasang lebih dari satu kalian Coppy Paste Nih :

       

       
• Sub Menu 1

       
• Sub Menu 2

       

       

    Coppy Paste ini dibawah tetapi hapus :

       

Menu 4

  <   Hapus ini

      Untuk Melihat Hasilnya Klik PRATINJAU terlebih Dahulu , Jika Sudah Merasa Puas Klik Simpan Template




Bagaimana Gampang Bukan !! Ayo Praktek'an ini ke Blog Kalian

Sumber: http://x-vblog31.blogspot.com/2013/01/cara-membuat-menu-bar-dan-sub-menu.html