دستورالعمل‌های مرجع CSS

ویژگی‌های CSS

backdrop-filter این ویژگی برای اعمال اثر گرافیکی به منطقه پشت عنصر استفاده می‌شود.

توضیح:برای مشاهده اثر، عنصر یا پس‌زمینه آن باید حداقل بخشی شفاف باشد.

افزودن اثر گرافیکی به منطقه پشت عنصر:

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

backdrop-filter: none|filter|initial|inherit;

مقدار	توضیح
none	مقدار پیش‌فرض. هیچ فیلتری را به پس‌زمینه اعمال نمی‌کند.
filter	لیستی از توابع فیلتر جدا شده با فاصله، مانند: blur() brightness() contrast() drop-shadow() grayscale() hue-rotate() invert() opacity() sepia() saturate() یا به URL فیلتر SVG اشاره دارد.
initial	این ویژگی را به مقدار پیش‌فرض خود تنظیم می‌کند. لطفاً به: مراجعه کنید initial。
inherit	این ویژگی را از عنصر والد خود ارث می‌برد. لطفاً به: مراجعه کنید inherit。

مقدار پیش‌فرض:	none
ارث‌پذیری:	خیر
انیمیشن:	پشتیبانی. لطفاً به: مراجعه کنیدویژگی‌های مرتبط با انیمیشن。
نسخه:	CSS3
نحوه استفاده از زبان برنامه‌نویسی JavaScript:	object.style.backdropFilter="grayscale(100%)"

اعداد در جدول نشان‌دهنده نسخه اولین مرورگرهایی هستند که این ویژگی را به طور کامل پشتیبانی می‌کنند.

با پیشوند -webkit- اعداد نشان‌دهنده نسخه اولین پشتیبانی از این پیشوند هستند.

Chrome	Edge	Firefox	Safari	Opera
76	79	103	9 -webkit-	63