b. v-shadow: Menentukan jarak vertikal bayangan dari elemen. Nilai positif akan menggeser bayangan ke bawah, sementara nilai negatif akan menggesernya ke atas.
c. blur: Menentukan tingkat kebluran bayangan. Semakin besar nilai blur, semakin blur bayangannya.
d. spread: Menentukan seberapa luas bayangan diperluas. Nilai positif akan memperluas bayangan, sementara nilai negatif akan menciutkannya.
e. color: Menentukan warna bayangan. Anda dapat menggunakan nilai warna CSS seperti nama warna, kode hex, atau RGB.
Berikut adalah beberapa contoh penggunaan properti box-shadow:
a. Efek Bayangan Sederhana:
.box {
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
}
Pada contoh di atas, kita memberikan efek bayangan sederhana dengan jarak horizontal 2px, jarak vertikal 2px, kebluran 4px, dan warna hitam dengan transparansi 0.4.
b. Efek Bayangan Lebih Kompleks:
.box {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.8),
0 0 20px rgba(0, 0, 0, 0.4),
0 0 30px rgba(0, 0, 0, 0.2);