Saturday, June 28, 2014

Cara membuat menu navigasi di atas header

Cara membuat menu navigasi di atas header - Hello visitor, Bang Juling, In the article that you are reading in this time with the title Cara membuat menu navigasi di atas header , we hope this article useful for your problem information. hopefully the contents of the post label baru, blogger, komputer, lainnya, tutorial, what we write you can understand. all right, have a nice reading.

Tittle : Cara membuat menu navigasi di atas header
Links : Cara membuat menu navigasi di atas header

Also read :


Cara membuat menu navigasi di atas header

Pagi :D
kali ini saya akan membuat tutorial . 
Cara membuat menu di atas header di blog

Langsung aja tutorial nya di bawah



                DEMO


1. Buka blogger- Template - Edit HTML 

2. Masukan kode berikut di atas ]]></b:skin>

/*The top Menu*/
#top{
margin:auto;
padding: 0;
width: 100%;
background:#696969;
border-bottom:1px solid #373127;
}
#top-wrap{
margin:auto;
padding: 0;
width: 960px;
background:#696969;
}
#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: georgia; font-weight:bold; font-size:10px;display:block;padding:10px 10px;color:#fff;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:#FF9900; color:#F0F8FF;}
/*The top Menu*/
#med{
margin:auto;
padding: 0;
width: 100%;
background:#696969;
}
#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: georgia; font-weight:bold; font-size:11px;display:block;padding:10px 10px;color:#696969;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:#696969;}
#navbar-iframe {
display: none !important;
}

3. Taruh kode berikut tepat di bawah head

<div id='top'>
<div id='top-wrap'>
<div class='topnav'>
<ul id='topnav'>
<li><a href='/'>HOME</a></li>
<li><a href='LINK'>DISKRIPSI</a></li>
<li><a href='LINK'>DISKRIPSI</a></li>
<li><a href='LINK'>DISKRIPSI</a></li>
</ul>
</div>
</div>
<div style='clear: both;'/>
</div>

4. Simpan dan selesai 



Thanks for visit and reading Cara membuat menu navigasi di atas header

That's the article Cara membuat menu navigasi di atas header in this time, hopefully it can be of benefit to all of you. well, see you in another article post.

You are now reading the article Cara membuat menu navigasi di atas header with the link address https://bangjuling.blogspot.com/2014/06/cara-membuat-menu-navigasi-di-atas.html

0 comments

Post a Comment