CSS mask-composite خاصية

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

mask-composite الخصائص تحدد عملية التركيب المستخدمة بين طبقة الشدادة الحالية والطبقة الموجودة تحتها.

مثال

عرض mask-composite القيم المختلفة للخصائص:

.masked {
  width: 200px;
  height: 200px;
  mask-repeat: no-repeat;
  mask-size: 100%;
  background: blue;
  -webkit-mask-image: url(img_rectangle.svg), radial-gradient(transparent 50%, black);
  mask-image: url(img_rectangle.svg), radial-gradient(transparent 50%, black);
}
.mask1 {
  mask-composite: add;
}
.mask2 {
  mask-composite: subtract;
}
.mask3 {
  mask-composite: intersect;
}
.mask4 {
  mask-composite: exclude;
}

جرب بنفسك

الجملة CSS

mask-composite: add|subtract|intersect|exclude|initial|inherit;

قيمة الخاصية

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

دعم المتصفح

الرقم في الجدول يعني إصدار المتصفح الذي يدعم الخاصية بشكل كامل.

الصفحات ذات الصلة

دروس:مظلة CSS

المرجع:CSS mask خاصية

المرجع:CSS mask-clip خاصية

المرجع:CSS mask-image خاصية

المرجع:CSS mask-mode خاصية

المرجع:CSS mask-origin خاصية

المرجع:CSS mask-position خاصية

المرجع:CSS mask-repeat خاصية

المرجع:CSS mask-size خاصية

المرجع:CSS mask-type خاصية