Pada postingan kali ini saya akan menggunakan format CSS code untuk membuat efek bayang pada gambar atau memberi kesan bayangan pada gambar yang kita pasang-sehingga tampilannya menjadi sedikit lebih menarik.
Sebagai contohnya anda boleh lihat dibawah ini :
Pada gambar pertama ini saya akan memasang sebuah gambar dengan tampilan yang original
Jika anda sudah cukup paham dengan yang saya maksud, kita edit scriptnya :
Copy kode diatas, kemudian masuk kedalam account blog anda -->> klik menu layout -->> Edit HTML -->> jangan lupa klik "expand widget template" -->> paste kode tadi diatas kode ]]></b:skin>-->> kemudian simpan..shadow{box-shadow: 8px 8px 10px #424242;-webkit-box-shadow: 8px 8px 10px #424242;-moz-box-shadow: 6px 6px 10px #424242;filter: progid:DXImageTransform.Microsoft.dropShadow(color=#424242, offX=8, offY=8, positive=true);}
Langkah selanjutnya adalah penerapan pada Image atau gambar, ambil sebuah url gambar, contoh :
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtSnc5MCqt4-5fxBMgERqJVpBTLQwjJEEATqDUelnV-ngnUZ2a8p3b2dZgrw2Eu4Ezza8Hy2Ujxmc4F-M2Kt_ARHi6j8iuHMaW0jk4qSqDM0fnme15nLfsoRTT4YaU16HM6-xulRj4p1L4/s1600-r/my_Logo.gif">Kemudian tambahkan kode class="shadow" didalamnya, maka hasilnya akan seperti ini :
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtSnc5MCqt4-5fxBMgERqJVpBTLQwjJEEATqDUelnV-ngnUZ2a8p3b2dZgrw2Eu4Ezza8Hy2Ujxmc4F-M2Kt_ARHi6j8iuHMaW0jk4qSqDM0fnme15nLfsoRTT4YaU16HM6-xulRj4p1L4/s1600-r/my_Logo.gif" class="shadow">selepas itu simpan, dan lihat hasilnya
*Pada contoh gambar diatas efek bayang berada di sebelah kanan dan bawah, sedangkan untuk merubah efek bayangnya disamping kiri dan atas. kamu cukup merubah kode CSS dan menambahkan tanda "min" (-) pada angkanya, contohnya sebagai berikut :
hasilnya seperti ini :.shadow{box-shadow: -8px -8px 10px #424242;-webkit-box-shadow: -8px -8px 10px #424242;-moz-box-shadow: -6px -6px 10px #424242;filter: progid:DXImageTransform.Microsoft.dropShadow(color=#424242, offX=-8, offY=-8, positive=true);}
0 Ulasan