CSS ماسک منشاء خصوصیت

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

mask-origin ویژگی مکان اولیه تصویر ماسک را مشخص می‌کند (یعنی منطقه مکان ماسک).

مثال

نمایش mask-origin مقدارهای مختلف ویژگی:

.masked {
  background: green;
  border: 30px solid blue;
  padding: 20px;
  -webkit-mask-image: url(img_circle.svg);
  mask-image: url(img_circle.svg);
  mask-size: 50%;
  mask-repeat: no-repeat;
}
.mask1 {
  mask-origin: border-box;
}
.mask2 {
  mask-origin: content-box;
}
.mask3 {
  mask-origin: padding-box;
}
.mask4 {
  mask-origin: fill-box;
}

آزمایش کنید

آموزش زبان CSS

mask-origin: border-box|content-box|padding-box|fill-box|stroke-box|view-box|initial|inherit;

مقدار ویژگی

جزئیات فنی

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

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

صفحات مرتبط

آموزش:CSS ماسک

منبع:CSS ماسک خصوصیت

منبع:CSS ماسک کلیپ خصوصیت

منبع:CSS ماسک ترکیب خصوصیت

منبع:CSS ماسک تصویر خصوصیت

منبع:CSS ماسک حالت خصوصیت

منبع:CSS ماسک موقعیت خصوصیت

منبع:CSS ماسک تکرار خصوصیت

منبع:CSS ماسک اندازه خصوصیت

منبع:CSS ماسک نوع خصوصیت