Mataja ya mask-mode ya CSS

Muhtasari na matumizi

mask-mode Tabia inaeleza kwamba picha ya kifungaji inaitwa kama kifungaji ya ngumu au alpha.

Mfano

Kuwa na picha ya kifungaji kama kifungaji ya ngumu:

.mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 70%;
  mask-repeat: no-repeat;
  mask-mode: luminance;
}

Jifunze kufanya:

Inayofanywa na Kiingilizi:

mask-mode: match-source|luminance|alpha|initial|inherit;

Thamani ya tabia

Thamani Muhtasari
match-source

Ikiwa tabia ya mask-image ni picha (URL ya picha au uwezo wa kuelewa), ingiza mask-mode kwa alpha.

Ikiwa tabia ya mask-image ni SVG <mask>, tumia tabia ya mask-type ya kiini ya <mask>.

Hii ni chaguo cha kuzingatia.

luminance Kutumia thamani ya ngumu ya picha ya kifungaji kama thamani ya kifungaji.
alpha Kutumia thamani ya alpha ya picha ya kifungaji kama thamani ya kifungaji.
initial Kufanya tabia hii kuwa kwa chaguo cha kuzingatia. Tazama: initial.
inherit Kuwa na tabia hii ikishikwa kutoka kwa kiini cha kiume. Tazama: inherit.

Maelezo ya uharibifu

Chaguo cha kuzingatia: match-source
Umuagizo: Hakuna
Muhtasari wa hali ya huzuni: Husitakabidhi. Tazama:Jamii ya muhimu wa hali ya huzuni.
Safuri: CSS Masking Module Level 1
Inayofanywa na Kiingilizi: object.style.maskMode="alpha"

Muungano wa Kifungaji wa Kifungaji cha Kibali

Mafuatili ya jumla ya tabia hii inaonyesha sasa kwa kina kwa kina wa programu ya kusoma intaneti ambayo inahakikisha kufaulu tabia hii.

Chrome Edge Firefox Safari Opera
120 120 53 15.4 106

相关页面

教程:CSS 遮罩

参考:Mataja ya mask ya CSS

参考:Mataja ya mask-clip ya CSS

参考:Mataja ya mask-composite ya CSS

参考:Mataja ya mask-image ya CSS

参考:Mataja ya mask-origin ya CSS

参考:Mataja ya mask-position ya CSS

参考:Mataja ya mask-repeat ya CSS

参考:Mataja ya mask-size ya CSS

参考:Mataja ya mask-type ya CSS