Membuat Shadow Box Dengan CSS

Agldcnet - 4.5 blog yang cantik dan enak dilihat sangat berperan penting agar para visitor betah berlama-lama di blog kita. Acap kali untuk mempercantik blog kita suka menggunakan gambar-gambar yang secara tidak langsung membuat blog kita menjadi berat. Bukan membuat visitor betah berlama-lama di blog kita, melainkan membuat mereka merasa tidak nyaman. Kali ini saya akan berbagi sedikit cara untuk memepercantik blog dengna menggunakan Shadow Box CSS.

sumber gambar :http://world-of-programmer.blogspot.com

Dan dibawah ini Shadow Box CSS dari masing-masing gambar :

Shadow Box CSS Gambar A :

{
-moz-box-shadow: -5px -5px #888;
-webkit-box-shadow: -5px -5px #888;
box-shadow: -5px -5px #888;
}

Shadow Box CSS Gambar B :

{
-moz-box-shadow: -5px -5px 5px #888;
-webkit-box-shadow: -5px -5px 5px #888;
box-shadow: -5px -5px 5px #888;
}

Shadow Box CSS Gambar C :

{
-moz-box-shadow: -5px -5px 0 5px #888;
-webkit-box-shadow: -5px -5px 0 5px#888;
box-shadow: -5px -5px 0 5px #888;
}

Shadow Box CSS Gambar D :

{
-moz-box-shadow: -5px -5px 5px 5px #888;
-webkit-box-shadow: -5px -5px 5px 5px#888;
box-shadow: -5px -5px 5px 5px #888; }

Shadow Box CSS Gambar E :

{
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px#888;
box-shadow: 0 0 5px #888;
}

Shadow Box CSS Gambar F :

{
-moz-box-shadow: 0 0 5px 5px #888;
-webkit-box-shadow: 0 0 5px 5px#888;
box-shadow: 0 0 5px 5px #888;
}

Untuk penggunaannya sobat tinggal pilih dari masing kode CSS diatas dan letakkan di bagian mana yang ingi kalian beri Shadow Box CSS . Misalkan ingin kalian letakkan pada outer-wrapper diblog sobat dan kode CSS yang akan di gunakan adalah gambar A, maka tinggal sobat copy code CSSnya dan gabungkan di code css outer-wrapper yang ada dilbog kalian.

Untuk code warna, Shadow Box CSS diatas terletak pada #888 dan bisa sobat ganti dengan code warna yang dinginkan .

source:http://d3t3ct1v3c0d3.blogspot.com/2012/04/membuat-shadow-box-dengan-css.html

Membuat Shadow Box Dengan CSS

Label