CSS mask-composite অপারেটর

  • পূর্ববর্তী পৃষ্ঠা mask-clip
  • পরবর্তী পৃষ্ঠা mask-image

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

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;

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

মান বর্ণনা
add সূত্র মাস্ককে লক্ষ্য মাস্কের উপরে রাখা
subtract সূত্র মাস্ককে লক্ষ্য মাস্কের বাইরে রাখা অঞ্চল
intersect সূত্র মাস্ক ও লক্ষ্য মাস্কের মধ্যে সম্পৃক্ত অঞ্চলকে লক্ষ্য মাস্ককে প্রতিস্থাপিত করুন
exclude সূত্র মাস্ক ও লক্ষ্য মাস্কের মধ্যে অসম্পৃক্ত অঞ্চলকে মিলিয়ে দিন
initial এই বৈশিষ্ট্যটিকে তার ডিফল্ট মানে সংযোজিত করুন। দেখুন: initial。
inherit এই বৈশিষ্ট্যটি তার পিতৃতৃতীয় উপাদান থেকে উত্তরাধিকার নেয়। দেখুন: inherit。

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

ডিফল্ট মান: add
পুনর্বিন্যসনযোগ্যতা: না
অ্যানিমেশন নির্মাণ: সমর্থিত নয়। দেখুন:অ্যানিমেশন সংক্রান্ত বৈশিষ্ট্য。
সংস্করণ： CSS Masking Module Level 1
JavaScript 语法： object.style.maskComposite="intersect"

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

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

Chrome Edge Firefox Safari Opera
120 120 53 15.4 106

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

শিক্ষা: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 অপারেটর

  • পূর্ববর্তী পৃষ্ঠা mask-clip
  • পরবর্তী পৃষ্ঠা mask-image