Membuat widget menu mendatar 4

Membuat Widget menu mendatar tanpa harus edit html.
1. Masuk ke blog anda
2. Pilih "Tata Letak" kemudian tambah "Gadged" dan pilih "HTML/Java Script"
3. Masukkan kode dibawah ini :

<style> #navcontainer { /* none needed */ } ul#navlist { margin: 0; padding: 0; list-style-type: none; white-space: nowrap; } ul#navlist li { float: left; font-family: verdana, arial, sans-serif; font-size: 9px; font-weight: bold; margin: 0; padding: 5px 0 4px 0; background-color: #666; border-top: 1px solid #e0ede9; border-bottom: 1px solid #e0ede9; } #navlist a, #navlist a:link { margin: 0; padding: 5px 9px 4px 9px; color: #fff; border-right: 1px solid #d1e3db; text-decoration: none; } ul#navlist li#active { color: #95bbae; background-color: #d1e3db; } #navlist a:hover { color: #fff; background-color: #FE9C54; } </style> <div id="navcontainer"> <ul id="navlist">
<li><a href="Link"><span>Judul 1</span></a></li>
<li><a href="Link"><span>Judul 2</span></a></li>
<li><a href="Link"><span>Judul 3</span></a></li>
<li><a href="Link"><span>Judul 4</span></a></li>
<li><a href="Link"><span>Judul 5</span></a></li>
</ul> </div>
Keterangan :
Link & Judul ganti dengan kebutuhan anda

0 komentar:

Poskan Komentar