Tutorial : Navigate Hover { 2 }

Assalamualaikum and annyeonghaseyo. Hari ni nak share navigate mcm blog tieqa ni. Act tieqa ada ubah sikit. So tak sama. lol . Navigate ni kalau korang perasan jenis ada background di belakang ;
{ e x a m p l e }

1. Copy code di bawah

<style>
a.dobi{
letter-spacing:1px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out; width:80px;
display:inline-block;
background:#F7F7F7;
color:#999;
cursor:vertical-text;
font:10px calibri;
padding:5px;
text-transform:uppercase;
text-align:center;
letter-spacing:1px;
text-decoration:none;
}

a.dobi:hover{
background:#000;
padding-right:10px;
width:80;
}

</style>
<div style="background-color: white; background-image: url(URLBG); background-position: center; border-radius: 0px 0px 0px 0px; border: 1px solid #efefef; margin-top: 0px; padding: 10px; width: 450px;">

<center>
<a class="dobi" href="http://www.blogger.com/LINK">TITLE</a>
<a class="dobi" href="http://www.blogger.com/LINK">TITLE</a>
<a class="dobi" href="http://www.blogger.com/LINK">TITLE</a>
<a class="dobi" href="http://www.blogger.com/LINK">TITLE</a>
</center></div></center>
2. Paste dalam blog korang
3. Preview & save.

Pink : warna background
Hijau : URL background
Ungu : width { boleh ubah }
Biru : link
Oren : tajuk