Make Cute Link Box
Ini screenchoot nya! :
- Before Hover
- After Hover
Nih, tutorialnya!
- Dashboard >>> Template >>> Edit HTML
- Cari kode /* Header untuk template designer
- Cari kode </style> untuk template skin.
- Copy kode di bawah
- Paste di atas kode yang kamu cari tadi
a.luhan{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhY-zU4RqXjyiwp9ML8nhvWtKKdI0QDATGEDrPHC_Jv1QDcQdKFUfZ0abVxq32bO30nXeC2dPAXoJqaVrbUvFq7gngwm1ISto2jKJaEYg-4AyGZvX57gz6gJoRxBDeDsbM70b60_TKAz7E/s1600/pinkk.gif);padding:5px;width:90px;color:white;padding:5px;-webkit-transition: 1.0s;-moz-transition: 1.0;font-family: arial;font-size: 11px;text-align: center;text-decoration: none;text-transform: uppercase;display:inline-block;margin:4px;border: 1px solid #F4DEC2;}a.luhan:hover{border-bottom: 0px solid gray;-webkit-transition: 1.0s;-moz-transition: 1.0s;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXY6_93B2EnRtCJ4PvIr6aroO_4-o74YjqXV75s__b9_ACrdHf1Sn6Gxx2Nw5wAOlGpHx6-yEW5jgYqTJnz6CE3SPccm4kUBO_tXEnPgetd2LHzm68Li8XY4nMGSu1j1zVIeyRfkzaSAs/s1600/aa.png);color:#000;border: 1px dashed #F4DEC2;}
Orange : BG url sebelum di hover
Red : BG url setelah di hover
- Setelah itu, taruh kode di bawah ini di bawah kode tadi ya!
<a class="luhan" href="link">buddies</a><a class="luhan" href="link">buddies</a>
Orange : Link blog
Purple : Nama
2 ice cream lover(s)
kok dedek coba enggak bisa kak?
BalasHapusizin repost :)
BalasHapus