mode

Baseline Widely available

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

Dasmode-Attribut definiert den Mischmodus auf der<feBlend>-Filterprimitive.

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

<feBlend>

Beispiel

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

html

<svg viewBox="0 0 480 200" xmlns="http://www.w3.org/2000/svg">  <filter x="0" y="0" width="100%" height="100%">    <feFlood      result="floodFill"      x="0"      y="0"      width="100%"      height="100%"      flood-color="seagreen"      flood-opacity="1" />    <feBlend in="SourceGraphic" in2="floodFill" mode="multiply" />  </filter>  <filter x="0" y="0" width="100%" height="100%">    <feFlood      result="floodFill"      x="0"      y="0"      width="100%"      height="100%"      flood-color="seagreen"      flood-opacity="1" />    <feBlend in="SourceGraphic" in2="floodFill" mode="color-dodge" />  </filter>  <image    href="mdn_logo_only_color.png"    width="200"    height="200"    filter="url(#blending1)" />  <image    x="220"    href="mdn_logo_only_color.png"    width="200"    height="200"    filter="url(#blending2)" /></svg>

Anmerkungen zur Verwendung

Wert	`<blend-mode>`
Standardwert	`normal`
Animierbar	Ja

Eine Beschreibung der Werte finden Sie unter<blend-mode>.

Spezifikationen

Specification
Filter Effects Module Level 1 # element-attrdef-feblend-mode

Browser-Kompatibilität

Help improve MDN

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