Membuat menu navigasi horisontal di blogspot (css menu)

Untuk membuatnya bisa lakukan posedur berikut:


1. Login ke akun blogger [Pilih Dashboard - Tata letak - Edit HTML]
    Cari kode berikut: ]]></b:skin>

2. Di bagian atas kode tersebut masukkan kode berikut

#menu {
background: #333;
float: left;
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
#menu li {
float: left;
font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
margin: 0;
padding: 0;
}
#menu a {
background: #333 url("http://herupurwito.com/script/images/n1bj0j.jpg") bottom right no-repeat;
color: #ccc;
display: block;
float: left;
margin: 0;
padding: 8px 12px;
text-decoration: none;
}
#menu a:hover {
background: #2580a2 url("http://herupurwito.com/script/images/2vjbz4g.jpg") bottom center no-repeat;
color: #fff;
padding-bottom: 8px;


3.  Klik tombol "Simpan Template"
4. Buka halaman "Tata Letak -> Elemen Halaman"
5. Pada Elemen header , klik " Tambah Gadget"
6. Pilih gadget html/javascript, masukkan script berikut :

<ul id="menu">
<li><a href="#">Clothes</a></li>
<li><a href="#">Dress for man</a></li>
<li><a href="#">Women's clothes</a></li>
<li><a href="#">Summer dress</a></li>
<li><a href="#">Artikel Komputer</a></li>
</ul>


Alamat Link di sesuaikan


sumber : http://artikelkomputerku.blogspot.com/2010/06/membuat-menu-navigasi-horisontal-di.html

Silahkan Pasang Komentar Anda

ShoutMix chat widget