Style CSS Menu Bar Untuk Blogger Terbaru

Style CSS Menu Bar Untuk Blogger Terbaru - CSS menu bar kali ini agak unik dan terlihat elegan, memang banyak Style CSS Menu Bar Untuk Blogger ada beberapa style tinggal anda pilih yang mana yang anda sukai, berikut tutorial untuk Style CSS Menu Bar Untuk Blogger terbaru :

Demo

1. Login ke Blogger anda  
2. Pilih Template
3. Pilih Edit HTML
4. Conteng Expand Widget
5. Cari Kode 
6. Lalu Pastekan kode dibawah ini sebelum kode 

.a-btn{
/* Bloggertrix  */
#menu2{
    width:90%;
    margin:25px auto;
}
#menu2 ul{
    list-style:none;
}
#menu2 li{
    display:block;
    float:left;
}
#menu2 li a{
    background:#e4e8eb url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlpLSxt0IL5vsS7zWoir6iUihD59r8yU8E-5B_yVcI2q-Nt4ufWBIWBC47Zl2HE38xsT94L1inMZ6D4h1WAktRDZsgPc2p81lbUH-CmZJbqp-D2MMVISSvx-o2RoAkhnVvx-6GdMbs0kY/s1600/menu_bg.gif) repeat-x;

    border:2px solid #bdc5cd;
    margin:0 1px;
    padding:15px 15px 15px 15px;
    display:block;
    float:left;
    color:#2b61a1;
    text-transform:uppercase;
    text-decoration:none;
    font-family:Geneva, Arial, Helvetica, sans-serif;
    font-size:13px;
    font-weight:bold;
    height: 30px;
}
#menu2 li a span{
    color:#636363;
    font-size:10px;
    text-transform:lowercase;
    font-family:Geneva, Arial, Helvetica, sans-serif;
    font-weight:normal;
}
#menu2 li a:hover{
    background:#e46825 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVLiPMG7RClbSVP9t1GEAGr7iYafzI9VlP9mo2v7EeirOvOK3vGkKJqbJx_G8RZWtkYcQVKN8mvBidoYMXGh9BsDvj61cXqhNpQPkl4Qkw69RVwWc4zx0sqzMYhdYB_x_QrnHQa7p9PAU/s1600/menu_hover.gif) repeat-x;
    border:2px solid #4a88ce;
    text-decoration:none;
}
#menu2 li a:hover span{
    color:#636363;

}
.current{
    background:#74befd url(images/menu_hover.gif) repeat-x;
    border:2px solid #4a88ce;
    margin:0 1px;
    padding:15px 15px 15px 15px;
    display:block;
    float:left;
    color:#2b61a1;
    text-transform:uppercase;
    text-decoration:none;
    font-family:Geneva, Arial, Helvetica, sans-serif;
    font-size:13px;
    cursor:pointer;
    font-weight:bold;
    height: 30px;
}
.current span{
    color:#636363;
    font-size:10px;
    text-transform:lowercase;
    font-family:Geneva, Arial, Helvetica, sans-serif;
    font-weight:normal;
}

7. Simpan Template
8. Kemudian pergi ke Tata Letak Klik TambahGadget >Pilih HTML/JavaScript lalu pastekan kode di bawah ini ke dalamnya

.a-btn{


Home
home page
About Us
about us page
Products
products page
Partners
partners page
Contact Us
contact page

9. Kemudian ganti url yang anda buat untuk menu  tersebut
10. Simpan Template

Style CSS Menu Bar Untuk Blogger Terbaru 2012-10-19T18:35:00+07:00 Rating: 4.5 Diposkan Oleh: Unknown