Sebagai catatan efek ini akan tampil jika browser yang kita gunakan adalah safari 1.1, firefox, chrome dan opera. Sedangkan jika browser yang digunakan masih Internet Explorer, maka efek tersebut tidak akan tampil alias seperti kotak biasa saja.
Yang akan kita lakukan kali ini adalah belajar membuat efek bayangan dengan cara kedua, contohnya seperti ini :
Atau efek shadownya bisa juga seperti ini :
Dengan kode CSS ini juga kita bukan cuma bisa membuat kotak ada bayangan tapi seperti sidebar , mainbar dan yang lainnya di template kita bisa ditambahkan efek bayangan. Untuk itu kode yang perlu ditambahkan adalah :
Untuk gambar pertama kodenya seperti ini :
box-shadow: 5px 5px 5px #000
-moz-box-shadow: 5px 5px 5px #000
-webkit-box-shadow: 5px 5px 5px #ddd
Untuk gambar kedua kodenya seperti ini :
box-shadow:inset 5px 5px 5px #000
-moz-box-shadow:inset 5px 5px 5px #000
-webkit-box-shadow:inset 5px 5px 5px #dddKita bisa merubah efek bayangan dengan mengatur nilai pixelnya, silahkan sesuaikan dengan nilai yang anda kehendaki. Sedangkan untuk merubah warna bayangan kita tinggal mengubah nilai hex kode warnanya.
**** Semoga Bermanfaat ****
1 komentar:
BAGUUUUSS SEKALI PAK ...!
Posting Komentar
Biar tambah semangat nulis blognya,ketikkan saran dan komentar. Walaupun singkat tetapi saran dan komentar yang anda berikan sangat berarti buat blog ini.