Tutorial : Tab Menu Simple Version 2

Advertisement

Tutorial : Tab Menu Simple Version 2

1. Layout > Add Gadget > Html
2. Copy code bawah ni paste kan kat ruangan HTML tu

<style>
.navi{
padding:5px;
display: inline-block;
font:14px verdana;
font-weight:bold;
text-align:center;
margin:6px;
color:white;
text-decoration:none;
letter-spacing:2px;
-webkit-transition-duration:0.5s;
}
.navi:hover{
box-shadow:inset 0px 14px 0px #97DAFB,inset 0px -14px 0px #51ABD7;
color:#fff;
color:black;
}
</style>
<center>
<div style="background: #ff7586; padding: 4px; width: 700px;">
<a class="navi" href="URL ANDA">TAJUK 1</a>
<a class="navi" href="URL ANDA">TAJUK 2</a>
<a class="navi" href="URL ANDA">TAJUK 3</a>
<a class="navi" href="URL ANDA">TAJUK 4</a>
<a class="navi" href="URL ANDA">TAJUK 5</a>
</div>
</center>

3. Color ikut suka korang nak tukar warna ape ye. lepas tu URL masuk kan url apa yang korang nak letak dalam tab menu ni. Tajuk pulak yang ada kat menu tu contoh Facebook , Tutorial ..

4. Faham ke ? hehe.. dah siap save !

Post a Comment

1 Comments

Terima kasih sudi baca artikel ini. Sila berikan komen anda. Jemput follow blog ini ye!