Navigation Hover #1

Halo met sore.. Aku mau bagi-bagi tutorial nih yuk ikuti!

Yaps, aku nak bagi navigation hover buat korang,

dapat di liat disini:

PREVIEW

credit: mocha-mocha

suka?

Yuk ikuti...

Pertama login ke blogger kalian

2. Pilih tata letak, dan add gadget

3.Pilih HTML/JAVA Script

4. Copi kode dibawah ini

<style>
.nice{
width:50px;
padding:4px;
margin:2px;
background:#FCDEE3;
font:8px tt;
text-align:center;
Text-decoration:none;
color:#FAB7C2;
text-transform:uppercase;
display:inline-block;
height:28px;
padding-top:25px;
border:2px solid #FCDEE3;
border-radius:50%;
-webkit-transition:All 0.5s ease;
-moz-transition:All 0.5s ease;
-o-transition:All 0.5s ease;
transform: rotate(0deg) ;
-webkit-transform: rotate(0deg) ;
-moz-transform: rotate(0deg) ;
-o-transform: rotate(0deg) ;
-ms-transform: rotate(0deg) ;
}
.nice:hover{transform: rotate(360deg) ;
-webkit-transform: rotate(360deg) ;
-moz-transform: rotate(360deg) ;
-o-transform: rotate(360deg) ;
-ms-transform: rotate(360deg) ;
background:#fff;
border:2px solid #FCCBD4;
}
@font-face {
font-family:tt !important;
src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf') !important;
}
</style>
<a class="nice" href="https://www.blogger.com/LINK%20HERE">link 1</a>
<a class="nice" href="https://www.blogger.com/LINK%20HERE">link 2</a>
<a class="nice" href="https://www.blogger.com/LINK%20HERE">link 3</a>
<a class="nice" href="https://www.blogger.com/LINK%20HERE">link 4</a>

</div>

Sudah bisa? 

Yaudah,

 bai-bai... 

Trims 

Daebak 

Arigatou Gozaimasu