ویژگی mask-size CSS

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

mask-size این ویژگی اندازه‌ی تصویر ماسک را مشخص می‌کند.

مثال

مثال 1

اندازه‌ی تصویر ماسک را (با واحد درصدی) تنظیم کنید:

.mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 70%;
  mask-repeat: no-repeat;
}

آزمایش کنید

مثال 2

اندازه‌ی تصویر ماسک را (با واحد پیکسلی) تنظیم کنید:

.mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 200px 200px;
  mask-repeat: no-repeat;
}

آزمایش کنید

آموزش زبان CSS

mask-size: auto|size|contain|cover|initial|inherit;

مقدار ویژگی

جزئیات فنی

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

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

صفحات مرتبط

آموزش:پوشش CSS

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

منابع:ویژگی mask-clip CSS

منابع:ویژگی mask-composite CSS

منابع:ویژگی mask-image CSS

منابع:ویژگی mask-mode CSS

منابع:ویژگی mask-origin CSS

منابع:ویژگی mask-position CSS

منابع:ویژگی mask-repeat CSS

منابع:ویژگی mask-type CSS