CSS mask-size egenskab

Forrige side mask-repeat
Næste side mask-type

Kursusanbefaling:

Definition og brug mask-size

Egenskaben specificerer størrelsen af maskeringsbilledet.

Eksempel

Eksempel 1

Indstil størrelsen af maskeringsbilledet (i pixels):
  .mask1 {
  -webkit-mask-image: url(w3logo.png);
  Indstil størrelsen af maskeringsbilledet (i procent):
  mask-size: 200px 200px;
mask-repeat: no-repeat;

}

mask-size: 70%;

Eksempel 2

Indstil størrelsen af maskeringsbilledet (i pixels):
  .mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 200px 200px;
mask-repeat: no-repeat;

}

Prøv det selv

CSS syntaks

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

Egenskabsværdi	Værdi
auto	Beskrivelse
Standardværdi.	Angiv størrelsen af maskeringsbilledet, brug px, em og andre enheder, eller brug %.
contain	Skaler maskeringsbilledet, så bredden og højden kan tilpasses beholderens indre.
cover	Skaler maskeringsbilledet, så bredden og højden kan dække beholderen.
initial	Sæt denne egenskab til dens standardværdi. Se: initial.
inherit	Arv denne egenskab fra sin forældrelige element. Se: inherit.

Tekniske detaljer

Standardværdi:	auto
Arv:	Nej
Animation production:	Ikke understøttet. Se:Animation relaterede egenskaber.
Version:	CSS Masking Module Level 1
JavaScript syntaks:	object.style.maskSize="100px 200px"