From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001
From: Peter Bengtsson <mail@peterbe.com>
Date: Tue, 8 Dec 2020 14:41:15 -0500
Subject: initial commit

---
 files/de/web/css/mask/index.html | 96 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 96 insertions(+)
 create mode 100644 files/de/web/css/mask/index.html

(limited to 'files/de/web/css/mask/index.html')

diff --git a/files/de/web/css/mask/index.html b/files/de/web/css/mask/index.html
new file mode 100644
index 0000000000..900127ae1b
--- /dev/null
+++ b/files/de/web/css/mask/index.html
@@ -0,0 +1,96 @@
+---
+title: mask
+slug: Web/CSS/mask
+tags:
+  - CSS
+  - Layout
+  - NeedsBrowserCompatibility
+  - Referenz
+  - SVG
+  - Web
+translation_of: Web/CSS/mask
+---
+<div>{{CSSRef}}</div>
+
+<h2 id="Übersicht">Übersicht</h2>
+
+<p><span class="seoSummary">The <code>mask</code> property in CSS allows users to alter the visibility of an item by either partially or fully hiding the item. This is accomplished by either masking or clipping the image at specific points.</span></p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="brush:css">/* Schlüsselwortwerte */
+mask: none;
+
+/* Bildwerte */
+mask: url(mask.png);                       /* Pixelbild, das als Maske verwendet wird */
+mask: url(masks.svg#star);                 /* Element mit SVG-Grafik, die als Maske verwendet wird */
+
+/* Kombinierte Werte */
+mask: url(masks.svg#star) luminance;       /* Element mit SVG-Grafik, die als Helligkeitsmaske verwendet wird */
+mask: url(masks.svg#star) 40px 20px;       /* Element mit SVG-Grafik, die als Maske verwendet wird, die 40px vom oberen Rand und 20px vom linken Rand positioniert ist */
+mask: url(masks.svg#star) 0 0/50px 50px;   /* Element mit SVG-Grafik, die als Maske mit einer Breite und Höhe von 50px verwendet wird */
+mask: url(masks.svg#star) repeat-x;        /* Element mit SVG-Grafik, die als horizontal wiederholte Maske verwendet wird */
+mask: url(masks.svg#star) stroke-box;      /* Element mit SVG-Grafik, die als Maske verwendet wird, die sich bis zur Box erstreckt, die von der Kontur eingeschlossen wird */
+mask: url(masks.svg#star) exclude;         /* Element mit SVG-Grafik, die als Maske verwendet wird und deren nicht überlappende Teile mit dem Hintergrund kombiniert werden */
+
+/* Globale Werte */
+mask: inherit;
+mask: initial;
+mask: unset;
+</pre>
+
+<h3 id="Werte">Werte</h3>
+
+<p>Falls der Wert ein URL Wert ist, wird das Element als SVG-Maske verwendet, dass durch die URI referenziert wird.</p>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Beispiele">Beispiele</h2>
+
+<pre class="brush: css">.target {
+  mask: url(#c1);
+}
+
+.anothertarget {
+  mask: url(resources.svg#c1);
+}
+</pre>
+
+<h2 id="Spezifikationen">Spezifikationen</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Spezifikation</th>
+   <th scope="col">Status</th>
+   <th scope="col">Kommentar</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("CSS Masks", "#the-mask", 'mask')}}</td>
+   <td>{{Spec2("CSS Masks")}}</td>
+   <td>Erweitert die Benutzung auf HTML Elemente.<br>
+    Erweitert die Syntax, indem sie als eine Kurzschreibweise für die neuen <code>mask-*</code> Eigenschaften in dieser Spezifikation definiert wird.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('SVG1.1', 'masking.html#MaskProperty', 'mask')}}</td>
+   <td>{{Spec2('SVG1.1')}}</td>
+   <td>Ursprüngliche Definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_Kompatibilität">Browser Kompatibilität</h2>
+
+{{Compat("css.properties.mask")}}
+
+<h2 id="Siehe_auch">Siehe auch</h2>
+
+<ul>
+ <li>{{Cssxref("clip-path")}}, {{Cssxref("filter")}}</li>
+ <li><a href="/de/docs/SVG_Effekte_auf_HTML_Inhalte_anwenden">SVG Effekte auf HTML Inhalte anwenden</a></li>
+ <li><a href="/de/docs/Web/SVG">SVG</a></li>
+</ul>
-- 
cgit v1.2.3-54-g00ecf