Tampilkan efek bayangan pada image

MENAMPILKAN EFEK BAYANG PADA IMAGE POSTINGAN
Penampilan image pada postingan akan lebih hidup jika ditambah dengan efek bayang yang akan muncul jika image tersebut disorot mouse. Warna dan ukuran dari efek bayang image tersebut dapat kita atur sesuai dengan warna dan ukuran yang kita kehendaki, paling tidak sesuai dengan latar postingan agar tampilannya bertambah baik.
Trik ini sebenarnya telah dibahas beberapa kali yaitu tentang Hover atau penampilan berubah ketika disorot mouse.
Coba anda lihat link-link dibawah ini (semuanya tentang Hover), untuk mempelajarinya.

MENAMPILKAN EFEK BINTANG BERKEDIP PADA LINK
CARA MEMBUAT BAGIAN BLOG BERKEDIP
POST FOOTER BERGANTI WARNA KETIKA MOUSE BERADA DIATASNYA
BACKGROUND JUDUL POT BERGANTI WARNA KETIKA MOUSE DIATASNYA.
MENGATUR PENAMPILAN LINK


Cara untuk menampilkan Efek Bayang (box shadow) pada image postingan adalah sebagai berikut :

Masuk ke Blogger
Pilih Rancangan - Edit HTML
Cari kode :

.post img {
padding:4px;
border:0px solid $bordercolor;
}


Copy kode dibawah ini dan paste tepat dibawah kode tadi

.post img:hover{
-webkit-box-shadow:6px 4px 9px #750000;
-moz-box-shadow: 6px 4px 9px #750000;
box-shadow : 6px 4px 9px #750000;}
.post blockquote {
margin:1em 20px;
}


Silahkan anda ganti kode yang berwarna merah
#750000 (coklat tua) : merupakan warna dari dari efek bayang yang muncul ketika disorot mouse. Silahkan ganti dengan warna yang ngin anda tampilkan.
6px 4px 9px : merupakan ukuran efek bayang. Ganti dengan ukuran yang ingin anda tampilkan.
Setelah selesai, klik tombol Simpan Template.
Selesai.