mask-type

Dasmask-type Attribut gibt an, welcher Maskenmodus,Alpha oderLuminanz, für den Inhalt des<mask> Elements beim Maskieren verwendet werden soll.

Sie können dieses Attribut mit den folgenden SVG-Elementen verwenden:

<mask>

Hinweis:Dieses Präsentationsattribut hat ein entsprechendes CSS-Eigenschaftsäquivalent:mask-type. Wenn beide angegeben sind, hat die CSS-Eigenschaft Vorrang.

Beispiel

html,body,svg {  height: 100%;}

html

<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">  <!-- Two identical masks other than the id and mask-type values -->  <mask mask-type="alpha">    <rect      fill="rgb(10% 10% 10% / 0.4)"      x="0"      y="0"      width="100%"      height="100%" />    <circle fill="rgb(90% 90% 90% / 0.6)" cx="50" cy="50" r="35" />  </mask>  <mask mask-type="luminance">    <rect      fill="rgb(10% 10% 10% / 0.4)"      x="0"      y="0"      width="100%"      height="100%" />    <circle fill="rgb(90% 90% 90% / 0.6)" cx="50" cy="50" r="35" />  </mask>  <!-- The first rect is masked with an alpha mask -->  <rect x="0" y="0" width="45" height="45" mask="url(#myMask1)" fill="red" />  <!-- The last rect is masked with a luminance mask -->  <rect x="55" y="0" width="45" height="45" mask="url(#myMask2)" fill="red" /></svg>

Maske

Für<mask> definiertmask-type, ob der Inhalt des Maskenelements als Luminanzmaske oder als Alphamaske behandelt wird.

Wert	`alpha` \|`luminance`
Standardwert	`luminance`
Animierbar	Diskret

alpha: Dieser Wert gibt an, dass die Alphawerte des<mask> Elements verwendet werden sollen; die Pixel des maskierten Objekts entsprechen der Undurchsichtigkeit der Maskenbereiche, ohne Berücksichtigung der Luminanz der Farben der Maske.
luminance: Dieser Wert gibt an, dass die Luminanzwerte des<mask> Elements verwendet werden sollen; die Undurchsichtigkeit des maskierten Objekts hängt von der Opazität und Helligkeit der Maske ab. Die Opazität einerluminance Maske wird durch dieR,G,B undA Kanäle der Maske bestimmt, wobei die Gleichung((0.2125 * R) + (0.7154 * G) + (0.0721 * B)) * A verwendet wird.

Spezifikationen

This feature does not appear to be defined in any specification.

Browser-Kompatibilität

Siehe auch

Help improve MDN

Learn how to contribute Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen •Fehler mit dieser Übersetzung melden