Efek Bayangan Blur atau Shadow Pada Gambar

Untuk membuat efek bayangan blur atau shadow pada sebuah gambar seperti ini :



Berikut caranya :
Masuk ke Rancangan > Edit HTML > centang Expand Template Widget

Copy kode berikut :

.shadow2{
box-shadow: 7px 7px 8px #818181;
-webkit-box-shadow: 7px 7px 8px #818181;
-moz-box-shadow: 7px 7px 8px #818181;
}

dan paste-kan di atas kode :

]]></b:skin>

Etz belum selesai untuk memberi efek bayangan blur atau shadow kita cukup menambahkan elemen "class" di dalam syntax.
contoh untuk gambar diatas tambahkan kode [ class="shadow2" ] dibelakang [img] seperti ini :

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6cTQW_7Yrr6TcdmK1fBlY1XttFOm5vYCPcTE8Em8IWXapvxX4ZRTYDqlR7JORMsJcbJYBPG8sNg4KAW1746WPLvLScymUVaxTE5m4gLfHFjJDBvZdp_WXNeHc974GXMBs5ID51W3Xo6U/s1600/wox.png"><img class="shadow2" style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 244px; height: 94px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6cTQW_7Yrr6TcdmK1fBlY1XttFOm5vYCPcTE8Em8IWXapvxX4ZRTYDqlR7JORMsJcbJYBPG8sNg4KAW1746WPLvLScymUVaxTE5m4gLfHFjJDBvZdp_WXNeHc974GXMBs5ID51W3Xo6U/s320/wox.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5527519166916349890" /></a>

Sekarang lihat hasilnya gambar ini :




Menjadi seperti ini ada efek blurnya :



COPAS
COba dan PASang
Selamat berkreasi... :)