فوظيفة CSS opacity()

التعريف والاستخدام

CSS شفافية() وظائف المرشح تُستخدم لتطبيق تأثيرات الشفافية على العنصر.

• 100% (أو 1) لا يؤثر
• 50% (أو 0.5) يجعل العنصر شفافًا بنسبة 50%
• 0% (أو 0) يجعل العنصر شفافًا تمامًا

مثال

مثال 1

ضبط شفافية الصور المختلفة:

#img1 {
  مرشح: شفافية(80%);
}
#img2 {
  مرشح: شفافية(50%);
}
#img3 {
  مرشح: شفافية(0.2);
}

تجربة شخصية

مثال 2

سيعمل شفافية() مع مرشح الخلفية استخدام الخصائص معًا:

div.transbox {
  لون الخلفية: rgba(255, 255, 255, 0.4);
  -webkit-مرشح الخلفية: شفافية(50%);
  مرشح الخلفية: شفافية(50%);
  حدود التعبئة: 20px;
  حدود الهوامش: 30px;
  وزن الخط: ثقيل;
}

تجربة شخصية

نص CSS

شفافية(الكمية)

تفاصيل التقنية

دعم المتصفح

الرقم في الجدول يمثل إصدار المتصفح الذي يدعم هذه الوظيفة بشكل كامل لأول مرة.

صفحات مرتبطة

هاوسا مرجع:CSS filter属性

هاوسا مرجع:فوظيفه CSS blur()

هاوسا مرجع:فوظيفه CSS brightness()

هاوسا مرجع:فوظيفه CSS contrast()

هاوسا مرجع:فوظيفه CSS drop-shadow()

هاوسا مرجع:فوظيفه CSS grayscale()

هاوسا مرجع:فوظيفه CSS hue-rotate()

هاوسا مرجع:فوظيفه CSS invert()

هاوسا مرجع:هاوسا CSS saturate() فانکشن

هاوسا مرجع:هاوسا CSS sepia() فانکشن