ຖານ CSS mask-composite

ການອະທິບາຍແລະການນໍາໃຊ້

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
ການສ້າງຄວາມຜູກມີ: ບໍ່
ການວິດີນລູກສະຫຼຸບ: ບໍ່ສາມາດສະຫຼຸບ. ບັນດາຄວາມທີ່ອ່າງໄປ:ລັກສະນະການວິດີນ.
ຮູບແບບ: ຫົວຂໍ້ສະຫວັດສະດວກການກະດູກ Masking Level 1
ສັບພາສາ JavaScript: object.style.maskComposite="intersect"

ການສະຫຼຸບບັນດາອຸປະກອນຄົ້ນຫາ

ຈຳນວນທີ່ຢູ່ໃນຕາຕະລາງສະແດງການສະຫຼຸບບັນດາຜູ້ຜູກມີຄວາມພະຍາຍາມສະຫຼຸບບັນດາປະສົມອາກາດນັ້ນທັງໝົດຄັ້ງທຳອິດ.

ຊຣັມ ເອດຈ ຟຣີກສ ຊາຟາຣີ ໂອເປຣາ
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