Selamat Datang

Selamat datang di NurulMukminin.blogspot.com ---- terimakasih atas kunjungannya

Sabtu, 05 Maret 2011

Membuat Tab Menu Horisontal

Ingin membuat "Tab Menu Horisontal" seperti halnya yang ada di blog ini. Jangan hawatir disini aku bagikan caranya buat teman2 semua. Caranya mudah saja, teman2 tinggal copas aja scrip Tab Menu Horisontal berikut ke layanan gadget yang sudah disediakan oleh Blogger.

Langkah2nya ikuti seperti petunjuk dibawah ini :
1. Buka Account Blogger kalian hingga sampai di dasbor blogger kalian
2. Klik Rancangan hingga muncul tampilan Elemen laman
3. Klik Add Gadget / Tambah Gadget
4. Pilih Add HTML/Javascrip
5. Copy dan Paste-kan code HTML Tab Menu Horisontal berikut ke konten gadget HTML/Javascrip :


<style type="text/css">
.h_mnu_01{
width: 100%;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
font-style: normal;
text-decoration: none;
}
.h_mnu_01 ul{
margin: 0;
padding: 0;
float: left; right;
width: ;
background: #000000;
border-top-width: 1px;
border-right-width: 0;
border-bottom-width: 1px;
border-left-width: 0;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #000000;
border-right-color: #000000;
border-bottom-color: #000000;
border-left-color: #000000
}

.h_mnu_01 ul li{
display: inline;
}

.h_mnu_01 ul li a{
float: left;
color: #FFFFFF;
padding: 5px 11px;
text-decoration: none;
border-right-width: 1px;
border-right-style: solid;
border-right-color: #ff9900;
}

.h_mnu_01 ul li a:visited{
color: #FFFFFF;
}

.h_mnu_01 ul li a:hover, .h_mnu_01 ul li .selected{
color: #FFFF00 !important;
padding-top: 5px;
padding-bottom: 5px;
background: #008000;
}

</style>



<div class="h_mnu_01"> 
<ul> 
<li><a href="#">H O M E</a></li>
<li><a href="#">P R O F I L L E</a></li>
<li><a href="#">P R O D U C T</a></li>
<li><a href="#">M Y  B L O G</a></li>
<li><a href="#">A B O U T</a></li>
</ul>
</div>


6. Kalau sudah Klik save / simpan
7. langsung ajah pergi ke blog kalian untuk lihat hasilnya


Naaah... jadi deh Tab Menu Horisontalnya.. hehe... mudah bukan...
oh iya untuk keterangan Tab Menu nya (seperti HOME, PROFILLE dst..) kalian bisa ubah sesuai kebutuhan kalian. Ok selamat mengedit-edit sendiri yah... Semoga Blog kalian semakin Ok dengan tambahan Tab Menu Horisontal ini.

Sekian dah Postingan kali ini mudah2an Postingan / ulasan tentang cara membuat Tab Menu Horisontal ini bermanfaat buat teman2 semua. Amin.

0 komentar: