From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/de/web/css/mix-blend-mode/index.html | 97 ++++++++++++++++++++++++++++++ 1 file changed, 97 insertions(+) create mode 100644 files/de/web/css/mix-blend-mode/index.html (limited to 'files/de/web/css/mix-blend-mode') diff --git a/files/de/web/css/mix-blend-mode/index.html b/files/de/web/css/mix-blend-mode/index.html new file mode 100644 index 0000000000..59efbddadd --- /dev/null +++ b/files/de/web/css/mix-blend-mode/index.html @@ -0,0 +1,97 @@ +--- +title: mix-blend-mode +slug: Web/CSS/mix-blend-mode +tags: + - CSS + - CSS Compositing + - CSS Eigenschaft +translation_of: Web/CSS/mix-blend-mode +--- +

{{CSSRef()}}

+ +

Übersicht

+ +

Die mix-blend-mode CSS Eigenschaft beschreibt, wie sich der Inhalt des Elements mit dem Inhalt des Elements unter ihm und dem Element-Hintergrund vermischen soll.

+ +

{{cssinfo}}

+ +

Syntax

+ +
/* Keyword values */
+mix-blend-mode: normal;
+mix-blend-mode: multiply;
+mix-blend-mode: screen;
+mix-blend-mode: overlay;
+mix-blend-mode: darken;
+mix-blend-mode: lighten;
+mix-blend-mode: color-dodge;
+mix-blend-mode: color-burn;
+mix-blend-mode: hard-light;
+mix-blend-mode: soft-light;
+mix-blend-mode: difference;
+mix-blend-mode: exclusion;
+mix-blend-mode: hue;
+mix-blend-mode: saturation;
+mix-blend-mode: color;
+mix-blend-mode: luminosity;
+
+/* Global values */
+mix-blend-mode: initial;
+mix-blend-mode: inherit;
+mix-blend-mode: unset;
+
+ +

Werte

+ +
+
<blend-mode>
+
Ein {{cssxref("<blend-mode>")}} der den zu verwendenden Mischmodus festlegt. Mehrere Werte können per Komma getrennt angegeben werden.
+
+ +

Formale Syntax

+ +
{{csssyntax}}
+ +

Beispiele

+ +
<svg>
+  <circle cx="40" cy="40" r="40" fill="red"/>
+  <circle cx="80" cy="40" r="40" fill="lightgreen"/>
+  <circle cx="60" cy="80" r="40" fill="blue"/>
+</svg>
+ +
circle { mix-blend-mode: screen; }
+ +

Result

+ +

{{EmbedLiveSample("Examples", "100%", "180")}}

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{ SpecName('Compositing', '#mix-blend-mode', 'mix-blend-mode') }}{{ Spec2('Compositing') }}Initial specification.
+ +

Browser Unterstützung

+ +{{Compat("css.properties.mix-blend-mode")}} + +

Siehe auch

+ + -- cgit v1.2.3-54-g00ecf