Kali ini saya akan memberitau menu navigasi
Ini sih saya buat sendiri dengan iseng2 aja di jsbin.com
Eh saya ingin buat2 tempat menu,tapi ini saya buat simple
Nah silakan lihat demonya,
Nah lumayan simple kan,?
Demo itu gak Mirip dengan gambar di atas lah
Nah langsung aja .
- Pertama buat notepad
- T'rus masukkan Code CSS ini di NOTEPAD tersebut
#menunavigasi {float:left; background:#00d2ff; width:auto; margin:0 auto; padding:0 auto;border-radius:4px 4px 4px 4px;border-bottom:4px solid #ff0;width:900px;}
#menubar {width:100%}
#menubar,#menubar ul {list-style:none; margin:0; padding-left:10px}
#menubar a {display:block; text-decoration:none; font-size:12px; font-weight:Bold; color:#555; border-left:1px solid #000; padding:8px 12px;}
#menubar li {float:left; width:auto}
#menubar li:hover a,#menubar a:active,#menubar a:focus,#menubar li.hvr a {color:#fff}
#blog{text-decoration:none;float:right;color:#000;font-size:12px;margin-right:10px;border-right:none;border-left:none;font-weight:bold;padding:8px 12px;color:#000;display:block; outline:none;background:yellow;}
- Sesudah itu simpan kasih nama dengan navigasi.css kasih formatnya ALL FILES
- Nah sekarang Install ke template dengan masukkan Code di bawah ini di atas Code </head>
<link href="NAMA FILE CSS" rel="stylesheet" type="text/css" />
- T'rus kita masukkan Code HTML atau xHTMLnya
<div id='menunavigasi'>
<ul id='menubar'>
<li><a href="#" style="background-color: yellow;" target="_blank"><span class="Apple-style-span" style="color: black;">Homepage</span></a></li>
<li><a href='#'>Kumpulan Tugas</a></li>
<li><a href='#'>Kumpulan Makalah</a></li>
<li><a href='#'>Tutorial Blogger</a></li>
<li><a href='#'>Tips Dan Trick</a></li>
<li><a href='#'>Bantuan Donasi</a></li>
</ul>
<div id='blog'>
<a href='http://www.belajar-code.net/'>CSS dan CSS3</a>
</div>
<div style='clear:both;'/>
</div>
<div class='clear'/>
- Nah siap deh,semoga bermanfaat ya sobat
Title : Menu Navigasi CSS dan CSS3
Description : Kali ini saya akan memberitau menu navigasi Ini sih saya buat sendiri dengan iseng2 aja di jsbin.com Eh saya ingin buat2 tempat men...
