توابع saturate() CSS

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

CSS saturate() توابع فیلتر برای تنظیم پراکندگی عناصر (قویت رنگ) استفاده می‌شوند.

• 0% (یا 0) باعث می‌شود عناصر کاملاً نابود شوند
• 100% (یا 1) هیچ اثری ندارد
• 200% (یا 2) باعث می‌شود عناصر فوق‌ساتی شوند

مثال

مثال 1

تنظیم饱和یت مختلف برای تصاویر:

#img1 {
  filter: saturate(0);
}
#img2 {
  filter: saturate(100%);
}
#img3 {
  filter: saturate(200%);
}

آزمایش کنید

مثال 2

برای saturate() با backdrop-filter استفاده ترکیبی از ویژگی‌ها:

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: saturate(450%);
  backdrop-filter: saturate(450%);
  padding: 20px;
  margin: 30px;
  font-weight: bold;
}

آزمایش کنید

نوشتار CSS

saturate(مقدار)

جزئیات فنی

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

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

صفحات مرتبطه

منابع:ویژگی filter CSS

منابع:فنون CSS blur()

منابع:فنون CSS brightness()

منابع:فنون CSS contrast()

منابع:فنون CSS drop-shadow()

منابع:فنون CSS grayscale()

منابع:فنون CSS hue-rotate()

منابع:فنون CSS invert()

منابع:توابع opacity() CSS

منابع:توابع sepia() CSS