Membuat Dampak Bayangan Di Css3
Dengan CSS3, anda sanggup membuat dampak lengkung pada setiap sudut border, menambahkan bayangan, dan memakai gambar sebagai border.
Untuk membuat dampak lengkung pada setiap sudut border, silahkan lihat di artikel Efek Lengkung Untuk Border Dengan CSS3.
Bagaimana cara membuat kotak menyerupai di sebelah kiri tersebut, di sana nampak terlihat ada dampak bayangan, dampak bayangan itu berwarna silver.
Efek bayangan itu dinamakan SHADOW.
Dengan CSS3 kita dimungkinkan membuat dampak bayangan menyerupai itu. Properti CSS3 yang dipakai membuat dampak shadow ialah box-shadow
.
Bentuk penulisan:
Dua nilai yang harus ada dari box-shadow
di atas ialah h-shadow
dan v-shadow
, sisanya opsional. h-shadow
dipakai untuk menetapkan posisi horizontal shadow, dan v-shadow
dipakai untuk menetapkan posisi vertical shadow.
Contoh berikut menambahkan box-shadow
untuk elemen ber-ID ‘myDIV’:
Dimana elemen ber-ID ‘myDIV’ yang diatur oleh box-shadow
mungkin menyerupai berikut:
Nantinya JavaScript dimungkinkan juga memanipulasinya, bentuk:
Umumnya penulisan di atas ditempatkan di dalam fungsi dan fungsi ditempatkan di bab HEAD, referensi fungsinya:
Untuk memanggil fungsi sanggup dari manapun yang di mau, contohnya akan di panggil dikala suatu tombol di klik:
Tambahan: Jangan lupa menambahkan prefix -moz-
untuk Firefox 3.6 dan versi sebelumnya dan prefix -webkit-
untuk Chrome dan Safari versi lama.