CSS mask-clip অপারেটর

বিবরণ ও ব্যবহার

mask-clip এই প্রতিযোগীটি হিসেবে মাস্ক ছবির প্রভাব করে এলাকা নির্দিষ্ট করে

একক

প্রদর্শন mask-clip প্রতিযোগী মূল্যবৃদ্ধি:

.masked {
  width: 150px;
  height: 150px;
  background: green;
  border: 30px solid blue;
  padding: 20px;
  -webkit-mask-image: url(img_circle.svg);
  mask-image: url(img_circle.svg);
  mask-size: 100% 100%;
}
.mask1 {
  mask-clip: border-box;
}
.mask2 {
  mask-clip: content-box;
}
.mask3 {
  mask-clip: padding-box;
}
.mask4 {
  mask-clip: fill-box;
}
.mask5 {
  mask-clip: stroke-box;
}

আপনার হাতে পরীক্ষা করুন

CSS গঠনশৈলী

mask-clip: border-box|content-box|padding-box|fill-box|stroke-box|view-box|no-clip|border|padding|content|text|initial|inherit;

বৈশিষ্ট্য মান

প্রযুক্তিগত বিবরণ

ব্রাউজার সমর্থন

টেবিলের সংখ্যা এটি প্রথম এই বৈশিষ্ট্যকে সম্পূর্ণরূপে সমর্থনকারী ব্রাউজারের সংস্করণ নির্দেশ করে。

সংশ্লিষ্ট পৃষ্ঠা

শিক্ষাক্রম:CSS মাস্ক

উল্লেখ:CSS mask অপারেটর

উল্লেখ:CSS mask-composite অপারেটর

উল্লেখ:CSS mask-image অপারেটর

উল্লেখ:CSS mask-mode অপারেটর

উল্লেখ:CSS mask-origin অপারেটর

উল্লেখ:CSS mask-position অপারেটর

উল্লেখ:CSS mask-repeat অপারেটর

উল্লেখ:CSS mask-size অপারেটর

উল্লেখ:CSS mask-type অপারেটর