Ada Banyak Banget Tampilan Untuk Membuat Menu Navigasi Horizontal Ini.Coba Perhatiin gambar di bawah Ini..
01 - Horizontal Tab Menu 10 :
Teman Teman BisaLangsung Melihat Cara Membuatnya Di sini
02 - Horizontal Tab Menu ( J ) :
Bisa Langsung Melihat Cara Membatnya Di sini.
03 - Horizontal Tab Menu ( F ):
Bisa Langsung Cara Membuatnya Di sini.
04 - Menu Dropdown With CSS:
Bisa Langsung Cara Membuatnya Di sini.
05 - Tab Navigasi With CSS (2):
Bisa Langsung Cara Membuatnya Di sini.
06 - Menu Navigasi CSS (6)
Bisa Langsung Melihat Cara Membuatnya DiSini.
07 - Menu Navigasi Link List
Untuk membuatnya, Kamu bisa mendownload templet Elegant Style & SEO Friendly, kemudian improvisasikan dengan blog ini. Atau sobat bisa menambahkan kode Css sebelum tag dan id navbar pada bagian body.
Kode CSS :/*-- (Menu/Nav) --*/
#nav{background:#fff url(http://i537.photobucket.com/albums/ff340/landsunezone/indonesian-flag.gif) no-repeat; height:32px; padding:4px 0 0; margin-bottom:0px}
#nav-left{float:left; display:inline; width:660px; padding-left:6px}
#nav-right{float:right; display:inline; width:200px}
#nav ul{position:relative; overflow:hidden; padding-left:0px; margin:0; font:1.0em Verdana,Arial,Helvetica,sans-serif;font-weight:bold;}
#nav ul li{float:left; list-style:none}
#nav ul li a, #nav ul li a:visited{display:block; color:#fff; margin:0 5px; padding:5px 4px; text-decoration:none}
#nav ul li a:hover{color:#800000; background-color:#fff; margin:0 5px; padding:5px 4px}
#nav ul li a.current, #nav ul li a.current:visited, #nav ul li a.current:hover{margin:0 8px; background-color:#fff; color:#fff; padding:5px 7px}
/*-- (Search) --*/
#search{background:#fff url(http://i537.photobucket.com/albums/ff340/landsunezone/indonesian-flag.gif) 6px 0px no-repeat; border:1px solid #333; float:right; height:23px; margin:0 15px 0 0; width:180px}
#search input{font-family:Verdana,Arial,Helvetica,sans-serif; background:transparent; border:0; color:#555; float:left; font-size:12px; margin:5px 0 0; padding:0px 2px 2px 30px; width:140px}
Dan ID Navbarnya Biasa Seperti Ini :<div id='nav'>
<b:section class='header-tabs' id='header-tabs' preferred='yes' showaddelement='yes'>
<b:widget id='LinkList1' locked='true' title='' type='LinkList'/>
<b:widget id='HTML1' locked='true' title='Search' type='HTML'/>
</b:section>
</div>
Nb : Tinggal Kamu Sesuaikan Kode warna ( #fff)Sama UrlNya Dengan Milik Kamu.
SELAMAT MENCOBA DAN SMOGA BERHASIL.!!!
