Tutorial : List With Special Hover

Assalamualaikum . Sebelum aimi berangkat pergi ke kem . Kem-nya hari sabtu . Saja nak berangkat sehari awal . Hehe . Tengok mata kucing tu . Eii , geramnya ! Kalau lah dapat mata macam tu . Mesti semua orang suka eden ! Eceyy , perasan kejap tak salah kan ? Hehe . Back to the topic , aimi nak share kat korang macam mana nak buat senarai dengan hover yang special gitu . Apa - apa pun korang mesti nak tengok contoh dulu kan baru nak buat . Tahu dah korang ni . Haha . Contoh boleh tengok kat bawah . 

Contoh

1. Copy code kat bawah ni 

<style>a.baeky{background:url(URLICON);background-repeat:no-repeat;background-size:15px;padding-left:20px;color:#000;margin-bottom:2px;font:11px verdana;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;color:#000;display:block;}a.baeky:hover{background:url(URLICON);background-repeat:no-repeat;background-size:14px;}</style><a class="baeky" href="LINK" >AYAT</a><br><a class="baeky" href="LINK" >AYAT</a><br><a class="baeky" href="LINK" >AYAT</a><br><a class="baeky" href="LINK" >AYAT</a><br>

2. Bila owner blog ni dah kata HANYA UNTUK TEMPLATE DESIGNER SAHAJA . Maknanya korang kene faham lah paste dekat mana ye kalau tak bukan Gadget HTML/Javascript tu . Faham ?
3. Preview & save

Pink : URL icon sebelum hover 
Biru : URL icon selepas hover
Oren : ayat korang
Hijau : link

Icon boleh ambil dekat >SINI< >SINI< Selebihnya di FREEBIES ye ? 

Credit to : AtiQahJaidin