فنکشن CSS drop-shadow()

تعریف و استفاده

CSS drop-shadow() فیلتر فنکشن اثرات پروژه را به تصاویر اعمال می‌کند.

مثال

مثال 1

برای تصاویر اثرات پروژه‌های مختلف اضافه کنید:

#img1 {
  filter: drop-shadow(8px 8px 10px gray);
}
#img2 {
  filter: drop-shadow(10px 10px 7px lightblue);
}

آزمایش کنید

مثال 2

برای تصاویر اثرات پروژه‌های مختلف اضافه کنید (از ارقام منفی برای سایه عمودی و افقی استفاده کنید):

#img1 {
  filter: drop-shadow(-8px -8px 10px gray);
}
#img2 {
  filter: drop-shadow(-10px -10px 7px lightblue);
}

آزمایش کنید

نحوه استفاده CSS

drop-shadow(h-shadow v-shadow تارشدگی گسترش رنگ)

جزئیات فنی

پشتیبانی مرورگر

جدول میزان پشتیبانی از این فنکشن را نسخه اولین مرورگر کاملاً پشتیبانی‌کننده نشان می‌دهد.

معلومات مرتبط

مطالبه:CSS فیلٹر پرپرٹی

مطالبه:CSS blur() فنکشن

مطالبه:CSS brightness() فنکشن

مطالبه:CSS contrast() فنکشن

مطالبه:CSS grayscale() فنکشن

مطالبه:CSS hue-rotate() فنکشن

مطالبه:CSS invert() فنکشن

مطالبه:CSS opacity() فنکشن

مطالبه:CSS saturate() فنکشن

مطالبه:CSS sepia() فنکشن