CSS mask-size özelliği

Tanım ve Kullanım

mask-size Özellik, örtüşüm katmanı resminin boyutunu belirler.

Örtüşüm katmanı resminin boyutunu (% olarak) ayarlar:

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

Örtüşüm katmanı resminin boyutunu (piksel olarak) ayarlar:

.mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 200px 200px;
  mask-repeat: no-repeat;
}

mask-size: auto|size|contain|cover|initial|inherit;

Değer	Açıklama
auto	Öntanımlı Değer.
boyut	Örtüşüm resminin boyutunu belirler, px, em gibi birimler veya % kullanılabilir.
contain	Örtüşüm resmini genişletir, böylece genişliği ve yüksekliği konteynerin içine uyacak şekilde ayarlar.
cover	Örtüşüm resmini genişletir, böylece genişliği ve yüksekliği konteyneri kaplar.
initial	Bu özelliği öntanımlı değerine ayarlar. Ayrıca bakınız: initial.
inherit	Bu özelliği ebeveyn elementinden devralır. Ayrıca bakınız: inherit.

Öntanımlı Değer:	auto
Devralabilirlik:	Hayır
Animasyon Yapımı:	Desteklenmiyor. Ayrıca bakınız:Animasyon İle İlgili Özellikler.
Sürüm:	CSS Masking Modülü 1
JavaScript Dilbilgisi:	object.style.maskSize="100px 200px"