CSS మాస్క్-కాంపోజిట్ అట్రిబ్యూట్

నిర్వచనం మరియు ఉపయోగం

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 మాస్కింగ్ మొడ్యూల్ లెవల్ 1
జావాస్క్రిప్ట్ సంకేతాలు: object.style.maskComposite="intersect"

బ్రౌజర్ మద్దతు

పట్టికలోని సంఖ్యలు ఈ లక్షణాన్ని పూర్తిగా మద్దతు ఇస్తున్న బ్రౌజర్ సంస్కరణను సూచిస్తాయి。

క్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఆపెరా
120 120 53 15.4 106

相关页面

ట్యూటోరియల్:CSS మాస్క్

పరిచయం:CSS మాస్క్ అట్రిబ్యూట్

పరిచయం:CSS మాస్క్-క్లిప్ అట్రిబ్యూట్

పరిచయం:CSS మాస్క్-ఇమేజ్ అట్రిబ్యూట్

పరిచయం:CSS మాస్క్-మోడ్ అట్రిబ్యూట్

పరిచయం:CSS మాస్క్-ఓరిజిన్ అట్రిబ్యూట్

పరిచయం:CSS మాస్క్-పోజిషన్ అట్రిబ్యూట్

పరిచయం:CSS మాస్క్-రీపీట్ అట్రిబ్యూట్

పరిచయం:CSS మాస్క్-సైజ్ అట్రిబ్యూట్

పరిచయం:CSS మాస్క్-టైప్ అట్రిబ్యూట్