Membuat Efek Shadow dengan CSS

Dalam pembuatan sebuah website, interface yang indah akan memberikan kenyamanan kepada setiap orang yang berkunjung pada website tesebut. Membuat efek yang realistik terkadang meningkatkan keindahan sebuah website, salah satunya dengan membuat efek shadow. Contoh :

Membuat efek shadow seperti contoh di atas bisa dilakukan dengan cara memanipulasi sebuah gambar yang kemudian dijadikan background image, tetapi cara ini akan sulit dilakukan dan merupakan suatu pemborosan (pemborosan waktu dan tenaga =P). Dengan bantuan CSS, kita dapat mengakali hal ini dengan cara yang sangat mudah. Tinggal mengikuti code CSS berikut :

.shadowbox {
border: 1px #999 solid;
padding: 5px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 0px 0px;
box-shadow: 3px 3px 3px #CCC; /* CSS3 */
-moz-box-shadow: 3px 3px 3px #CCC; /* Untuk Safari, Chrome, dan WebKit lainnya*/
-webkit-box-shadow: 3px 3px 3px #CCC; /* Untuk Firefox */
}
Code HTML :
< div class="shadowbox" > 5 Testimonials < /div >

Cukup mudah bukan? Sebenarnya bermain dengan CSS itu sangat menyenangkan.

Selamat Mencoba =D
Sumber:http://www.cactusproject.com/blog/membuat-efek-shadow-dengan-css.php