mask-composite
Misol
mask-composite xususiyatining turli qiymatlarini ko‘rsating:
.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;
}
O‘zingiz sinab ko‘ring »
Ta’rif va qo‘llanilishi
mask-composite xususiyati joriy maska qatlamiga uning ostidagi maska qatlamlari bilan qo‘llaniladigan kompozitsiya amalini belgilaydi.
| Standart qiymat: | add |
|---|---|
| Meros qilinadi: | yo‘q |
| Animatsiya qilinadi: | yo‘q. animatable haqida o‘qing |
| Versiya: | CSS Masking moduli, 1-daraja |
| JavaScript sintaksisi: | object.style.maskComposite="intersect" |
Brauzerlarda qo‘llab-quvvatlash
Jadvaldagi sonlar xususiyatni to‘liq qo‘llab-quvvatlaydigan birinchi brauzer versiyasini ko‘rsatadi.
| Xususiyat | |||||
|---|---|---|---|---|---|
| mask-composite | 120 | 120 | 53 | 15.4 | 106 |
CSS sintaksisi
mask-composite: add|subtract|intersect|exclude|initial|inherit;
Xususiyat qiymatlari
| Qiymat | Tavsif |
|---|---|
| add | Manba (source) maqsad (destination) ustiga joylashtiriladi |
| subtract | Manba maqsaddan tashqariga tushgan joylardagina joylashtiriladi |
| intersect | Manbaning maqsad bilan ustma-ust tushadigan qismlari maqsad o‘rnini egallaydi |
| exclude | Manba va maqsadning ustma-ust tushmaydigan sohalari birlashtiriladi |
| initial | Bu xususiyatni standart qiymatiga o‘rnatadi. initial haqida o‘qing |
| inherit | Bu xususiyatni ota elementidan meros qilib oladi. inherit haqida o‘qing |
Tegishli sahifalar
CSS ma’lumotnomasi: mask xususiyati
CSS ma’lumotnomasi: mask-clip xususiyati
CSS ma’lumotnomasi: mask-image xususiyati
CSS ma’lumotnomasi: mask-mode xususiyati
CSS ma’lumotnomasi: mask-origin xususiyati
CSS ma’lumotnomasi: mask-position xususiyati
CSS ma’lumotnomasi: mask-repeat xususiyati
CSS ma’lumotnomasi: mask-size xususiyati
CSS darsligi: CSS masking
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!