Footer Menu

ads here

Cara membuat menu navigasi di atas header blog

advertise here
Berikut adalah Cara membuat menu navigasi di atas header blog


Kode :
/*The top Menu*/
#top{
margin:auto;
padding: 0;
width: 100%;
background:#343434;
border-bottom:1px solid #373127;
}
#top-wrap{
margin:auto;
padding: 0;
width: 960px;
background:#000000;
}
#navwrap {margin: 0px auto; width:560px; float:left;background:#080705;}
.topnav ul {list-style:none;margin:0;padding:0px; float:left;}
.topnav li {float:left;margin:0;text-align:center;}
.topnav li a {font-family: arial; font-weight:bold; font-size:9px;display:block;padding:6px 6px;color:#E0E0E0;text-decoration:none; text-transform:uppercase;}
.topnav li a {background:none; }
.topnav li a:hover, li a:focus, li a:active {text-decoration:none; background:#3b5998; color:#E0E0E0;}
/*The top Menu*/
#med{
margin:auto;
padding: 0;
width: 100%;
background:#000000;
}
#med-wrap{
margin:auto;
padding: 0;
width: 960px;
}
.mednav ul {list-style:none;margin:0;padding:0px; float:left;}
.mednav li {float:left;margin:0;text-align:center;}
.mednav li a {font-family: arial; font-weight:none; font-size:9px;display:block;padding:8px 8px;color:#000000;text-decoration:none; text-transform:lowercase;}
.mednav li a {background:none; }
.mednav li a:hover, li a:focus, li a:active {text-decoration:underline; color:#000000;}
#navbar-iframe {
display: none !important;
}
Cara :
Tempatkan kode di atas sebelum kode ]]></b:skin> kemudian copy kode di bawah ini dan paste tepat di bawah kode </head>
<div id='top'><div id='top-wrap'><div class='topnav'><ul id='topnav'><li><a href='#'>home</a></li><li><a href='#'>Peta Situs</a></li><li><a href='#'>Profil</a></li><li><a href='#'>Privacy Policy</a></li><li><a href='#'>Kontak</a></li><li><a href='#'>About</a></li></ul></div></div><div style='clear: both;'/></div>

Keterangan : 
warna merah : url yang anda inginkan
warna biru : sesuaikan sendiri

Click to comment