- Back to Home »
- CSS Tricks »
- Cara Membuat Link Shadow saat Disentuh Mouse
Langkah-langkah:
1.Masuk ke:
Untuk Dashboard Baru Masuk : Blogger » Edit HTML » Centang Expand Widget
Untuk Dashboard Lama Masuk : Blogger » Rancangan » Edit HTML » Centang Expand Widget
2.Cari kode seperti dibawah ini
a:hover{color:#333; text-decoration:none; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out; -o-transition:all .2s ease-out;}
atau a:hover saja.
3.Ganti kode tersebut menjadi kode dibawah ini
a:hover{color:#FF0000;text-shadow: 0 0 0.5em #FFEE00,0 0 0.5em #FFEE00;text-decoration:none; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out; -o-transition:all .2s ease-out;}
4.Kemudian Simpan dan liat hasilnya
Keterangan:
1. Semakin banyak kode 0 0 0.5em #FFEE00 akan semakin tebal Shadow/Bayangan yang dikeluarkan contoh:
a:hover{color:#FF0000;text-shadow: 0 0 0.5em #FFEE00,0 0 0.5em #FFEE00,0 0 0.5em #FFEE00,0 0 0.5em #FFEE00;text-decoration:none; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out; -o-transition:all .2s ease-out}
Sumber