preserveAlpha

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

Das preserveAlpha Attribut gibt an, wie ein <feConvolveMatrix> Element mit Alpha-Transparenz umgeht.

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

Beispiel

html
<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
  <filter id="convolveMatrix1" x="0" y="0" width="100%" height="100%">
    <feConvolveMatrix kernelMatrix="1 -1 2 0 0 0 0 0 -2" preserveAlpha="true" />
  </filter>
  <filter id="convolveMatrix2" x="0" y="0" width="100%" height="100%">
    <feConvolveMatrix
      kernelMatrix="1 -1 2 0 0 0 0 0 -2"
      preserveAlpha="false" />
  </filter>

  <image
    href="mdn_logo_only_color.png"
    width="200"
    height="200"
    filter="url(#convolveMatrix1)" />
  <image
    x="220"
    href="mdn_logo_only_color.png"
    width="200"
    height="200"
    filter="url(#convolveMatrix2)" />
</svg>

Verwendungshinweise

Standardwert false
Wert true | false
Animierbar Ja
true

Dieser Wert gibt an, dass die Faltung nur auf die Farbkanäle angewendet wird. In diesem Fall entfernt der Filter vorübergehend die Alpha-Vormultiplikation von den Farbkomponentenwerten, wendet den Kernel an und fügt anschließend die Alpha-Vormultiplikation als letzten Schritt wieder hinzu.

false

Dieser Wert gibt an, dass die Faltung auf alle Kanäle angewendet wird, einschließlich des Alphakanals.

Spezifikationen

Specification
Filter Effects Module Level 1
# element-attrdef-feconvolvematrix-preservealpha

Browser-Kompatibilität