SVG/Element/mask

Aus SELFHTML-Wiki
< SVG‎ | Element(Weitergeleitet von SVG/Elemente/mask)
Wechseln zu: Navigation, Suche

Das mask-Element legt eine Schablone an, die dann nur Teilbereiche einer beliebigen Form oder Grafik sichtbar macht.

Syntax
Start-Tag: notwendig
End-Tag: notwendig
Elternelemente
Darf vorkommen in:
defs
erlaubte Inhalte
beliebige Anzahl von path-, text-Elementen oder grafischen Elementen
Attribute
Name Inhalt Standardwert Bedeutung
height NUMBER Höhe
maskUnits userSpaceOnUse, objectBoundingBox objectBoundingBox
maskContentUnits UserSpaceOnUse (Standardwert)
BoundingBox
systemLanguage IANA Sprachkürzel
transform CDATA
width NUMBER Breite
x NUMBER X-Koordinate
y NUMBER Y-Koordinate

Attribut: Pflichtattribut
Attribut: optionales Attribut

Beispiel
    <defs>
        <mask id="Maske" maskUnits="userSpaceOnUse"
              x="0" y="0" width="200" height="80">
            <rect x="0" y="0" width="100" height="80" fill="white"/>
        </mask>

        <text id="Text" x="84" y="48" 
              font-size="20" font-weight="bold" text-anchor="middle">
            schwarz &amp; weiß 
        </text>
    </defs>

    <use href="#Text" fill="black" mask="url(#Maske)"/>
Der Hintergrund besteht aus einem schwarzen Rechteck (Ohne Angabe einer Füllfarbe wird der Standardwert schwarz verwendet.).

Der Text wird als symbol definiert und mit use zweimal aufgerufen:

  1. als weiße Schrift und dann noch
  2. als schwarze Schrift mit der Maske:
Die Maske beinhaltet ein weißes Rechteck, das die linke Hälfte des Hintergrunds verdeckt.


Siehe auch

Weblinks