0 Membuat efek Bayangan(hover) di Link

Satu lagi tips mempercantik blog, yaitu memberi efek bayangan yang muncul(hover) ketika ada mouse yang jalan di atas link, biasanya kan ling akan muncul garis bawahnya (underlinee) kalau ada mouse jalan di atasnya, tapi di sini kita akan ubah efeknya agar linknya tidak muncul garis bawah tapi muncul bayangan, seperi di blog saya ini loh, coba deh arahkan kursor kamu di salah satu link, pasti akan muncul bayangaya kan ??, kalau tidak brati browsernya situ yang jadul......heuhehehehue , ga ding just guyon...., mari kita mulai, hhhmmm, enaknya kita kasi bayangan di link bagian blog yang mana ya ??, yang mana saja, terserah kamu.

Caranya masuk ke Blogger  >>  Design  >> Edit HTML, beri tanda centang di tulisan Expand Widget Templates, nah kalau sudah tekan Ctrl+f dan ketikan kata hover, tekan enter, kamu akan menemukan kata hover di kalimat paling tidak mirip seperti berikut

..................................................................................................................................................................

a:hover{color:#B60000; text-decoration: underline; }

atau seperti ini

a:hover {
text-decoration: underline;
color: #ff0000;
}

..................................................................................................................................................................

nah kamu ganti kata underline jadi none terus setelahnya di tambahin kode efek bayanganya, misalkan yang kaya di blog saya seperi ini :

 ..................................................................................................................................................................

text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40, 2px -10px 10px #f10;

..................................................................................................................................................................

biar jadi seperti ini

..................................................................................................................................................................

a:hover{color:#B60000; text-decoration: none; text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40, 2px -10px 10px #f10;}

..................................................................................................................................................................



Catatan : ada lebih dari satu perintah hover di template, nah kamu bisa tambahin semuanya.... 

lalu simpan template kamu,ucapkanlah Alhamdulillah dan lihat blog kamu, sorot linknya

 Jadinya seperti ini loh. jelas ??.., silakan mencoba dan semoga berhasil.