Cara Memberi Efek Hover Shadow Pada Link di Blog Cara Memberi Efek Hover Shadow Pada Link di Blog

Assalamualaikum WR... WB...
Sharing saya kali ini akan membahas tentang membuat efek hover menggunakan efek bayangan(shadow).
Apakah Yang dimaksud dengan shadow?? Dari artinya saja sudah jelas yaitu "Bayangan". Shadow adalah bayangan.

Secara sederhana pengertian dan fungsi hover adalah merubah beberapa variable dalam blog/template ketika cursor berada di atas bagian tersebut.
Variabel yang biasanya diterapkan sebagai hover adalah :
background (baik background color ataupun background image), border, warna font, jenis font dan tebal font serta fungsi text decoration (pada link). Sumber : http://gubhugreyot.blogspot.com

Kita langsung aja ke intinya ya...

A.Cara Memberi Efek Hover Shadow Link
Silahkan langsung menuju Rancangan > Edit Html.
1. Cari kode

a:hover {

    text-decoration: underline;

    color: #0cff00;

    }

2. Ganti dengan

a:hover {

  color: #ff00ff;

  text-decoration:none;

  text-shadow:5px 5px 5px #ff00ff}

Mudahkan kan??
Anda Juga dapat mengganti warna sesuai selara anda : silahkan pilih warna yang anda inginkan disini : Kode Warna HTML

B.Cara Memberi Efek Hover Shadow pada Gambar
Anda juga bisa menambahkan efeknya ke gambar..
1. Cari kode

.post img { padding: 10px; border: 0px }

Setiap blog berbeda lho??? jadi sobat sesuaikan sendiri ya??
2. Bawahnya tambahkan kode

.post img:hover {-moz-box-shadow: 0 0 13px;} 

Mudah kan?? Sebenarnya banyak sekali efek-efek hover yang lainnya... Ini hanyalah sedikit dari yang saya ketahui.. :p

Selamat mencoba...
Wassalamualaikum WR.... WB...

sumber : azka-veiro blog