CSS mask-type özelliği

Önceki sayfa mask-size
Sonraki sayfa max-block-size

Tanım ve Kullanım

mask-type Bu özellik, SVG <mask> elementinin ışıklandırma kapak olarak mı yoksa alpha kapak olarak mı işlem göreceğini belirler.

Bu özellik SVG <mask> elementi için geçerlidir.

Örnek

İki SVG <mask> elementini görüntüleyin; biri mask-type: alpha， diğeri mask-type: luminance：

<svg width="200" height="120" xmlns="http://www.w3.org/2000/svg">
  </defs>
    <mask id="mask1" maskContentUnits="objectBoundingBox" style="mask-type:alpha">
      <rect width="10" height="10" fill="red" fill-opacity="0.7" />
    </mask>
    <mask id="mask2" maskContentUnits="objectBoundingBox" style="mask-type:luminance">
      <rect width="10" height="10" fill="red" fill-opacity="0.7" />
    </mask>
  </defs>
</svg>

Kendi Kendinize Uygulayın

CSS Dilbilgisi

mask-type: luminance|alpha|initial|inherit;

Özellik Değeri

Değer	Açıklama
luminance	Kapak görselini parlaklık kapak olarak görüntülenir. Varsayılan değer.
alpha	Kapak görselini alpha kapak olarak görüntülenir.
initial	Bu özelliği varsayılan değerine ayarlar. Bakınız initial。
inherit	Bu özelliği ebeveyn elementinden devralır. Bakınız inherit。

Teknik Ayrıntılar

Varsayılan Değer:	luminance
Devralabilirlik:	Hayır
Animasyon Yapımı:	Desteklenmiyor. Bakınız:Animasyon İle İlgili Özellikler。
Sürüm:	CSS Masking Modülü 1
JavaScript Dilbilgisi:	object.style.maskType="alpha"