Pasang menu ini di blogmu.

Copas kode berikut di HTML/Javascript.
<style type="text/css">
.menution ul li{display: inline;}
.menution1 { padding: 2px 0.5em; text-decoration: none; float: left; color: black; background: #4FCF26; border: 2px solid #fff; list-style: none;
-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; -webkit-transform:rotate(-25deg);-moz-transform:rotate(-25deg);-o-transform:rotate(-25deg);
}
.menution2 { padding: 2px 0.5em; text-decoration: none; float: left; color: black; background: #BFDCFF; border: 2px solid #fff; list-style: none;
-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; -webkit-transform:rotate(25deg);-moz-transform:rotate(25deg);-o-transform:rotate(25deg);
}
.menution1:hover, .menution2:hover{ background: #F0BFFF; color:#ccc;
-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg)
}
</style>

<div class="menuqu">
<ul>
<li class="menution1"><a href='#'>Home</a></li>
<li class="menution2"><a href='#'>Menu1</a></li>
<li class="menution1"><a href='#'>Menu2</a></li>
<li class="menution1"><a href='#'>Menu3</a></li>
<li class="menution2"><a href='#'>Menu4</a></li>
<li class="menution1"><a href='#'>Menu5</a></li>
</ul>
</div>
Klik Save.

Posting Komentar

Konversi Kode
[Mulai Senin, 30 Januari 2012] Maaf, Jangan Masukkan Link Pada Komentar