Cute Link Box 2

sebelum hover

setelah hover

Assalamu'alaikum! Tadi Resti post linkbox 1 sekarang linkbox 2. Link box ini kalau hover berputar unik kan? Klik ini untuk live priview.



1. Dashboard
2. Laman/post (terserah dimana kamu akan menaruhnya)
3. Html (sebelah compose)
4. taruh kode dibawah ini

<style>
a.ranna {
font-size: 12px;
font-family: century gothic;
display:inline-block;
text-align:center;
width: 70px;
color:#fea5c2;
background:#fff5f7;
border-top: 3px solid pink;
border-bottom: 3px solid pink;
border-left: 2px dotted pink;
border-right: 2px dotted pink;
padding:3px;
margin:2px;
text-decoration: none;
-webkit-transition-duration:1200ms;
-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;
}
a.ranna:hover          {
display:inline-block;
text-align:center;
box-shadow: 1px 5px 5px 5px #ffd9d9;
width: 70px;
color: pink;
border-top: 3px solid pink;
border-bottom: 3px solid pink;
border-left: 3px solid pink;
border-right: 3px solid pink;
background:#ffffff;
-webkit-transition-duration:1200ms;
-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;
border-radius:50%;
-webkit-transform:rotate(360deg);
-moz-transform:rotate(360deg);
-o-transform:rotate(360deg);
-ms-transform:rotate(360deg);
transform:rotate(360deg);
}
</style>
<br />
<center>
</center>
<center>
<span style="color: magenta;"><br /></span></center>
<center>
</center>
<center>
<a class="ranna" href="https://.blogspot.com/">Who</a>
<a class="ranna" href="https://.blogspot.com/">Who</a>
<a class="ranna" href="https://.blogspot.com/">Who</a>
<a class="ranna" href="https://.blogspot.com/">Who</a>
<a class="ranna" href="https://.blogspot.com/">Who</a>
<a class="ranna" href="https://.blogspot.com/">Who</a>
<a class="ranna" href="https://.blogspot.com/">Who</a>

-edit sesukamu
5. save

---

Terima kasih telah membaca, tinggalkan komentar ya!

---