CSS mask-type eigenschap

Vorige pagina mask-size
Volgende pagina max-block-size

Definitie en gebruik

mask-type Deze eigenschap specificeert of het SVG <mask> element als een helderheidsmasker of als een alpha-masker moet worden behandeld.

Deze eigenschap is van toepassing op het SVG <mask> element zelf.

Voorbeeld

Bekijk de twee SVG <mask> elementen; een gebruikt mask-type: alphaen een andere gebruikt 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>

Probeer het zelf uit

CSS Syntax

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

Eigenschapswaarde

Waarde	Beschrijving
luminance	Zie de maskeringsafbeelding als een helderheidsmasker. Standaardwaarde.
alpha	Zie de maskeringsafbeelding als een alpha-masker.
initial	Deze eigenschap instellen op de standaardwaarde. Raadpleeg initial.
inherit	Deze eigenschap erfgenomen van de ouderweergave. Raadpleeg inherit.

Technische details

Standaardwaarde:	luminance
Inheritantie:	Nee
Animatieproductie:	Niet ondersteund. Raadpleeg:Animatiegerelateerde eigenschappen.
Versie:	CSS Masking Module Level 1
JavaScript Syntax:	object.style.maskType="alpha"