Attribut mask-type CSS

Page précédente mask-size
Page suivante max-block-size

Définition et utilisation

mask-type Cette propriété spécifie si l'élément <mask> SVG doit être traité comme un masque de luminance ou comme un masque alpha.

Cette propriété s'applique à l'élément <mask> SVG lui-même.

Exemple

Voir deux éléments <mask> SVG ; l'un utilise mask-type: alpha，l'autre utilise 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>

Essayer par vous-même

Syntaxe CSS

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

Valeur de l'attribut

Valeur	Description
luminance	Considère l'image de masque comme un masque de luminance. Valeur par défaut.
alpha	Considère l'image de masque comme un masque alpha.
initial	Réinitialise cette propriété à sa valeur par défaut. Voir : initial.
inherit	Inherits cette propriété de son élément parent. Voir : inherit.

Détails techniques

Valeur par défaut :	luminance
Héritabilité :	Non
Réalisation des animations :	Non pris en charge. Voir :Propriétés liées aux animations.
Version :	Module de masquage CSS Niveau 1
Syntaxe JavaScript :	object.style.maskType="alpha"