SVG-Attributreferenz
SVG-Elemente lassen sich mit Attributen verändern, die beeinflussen, wie ein Element verarbeitet oder dargestellt wird.
Nachfolgend finden Sie eine Liste aller in SVG verfügbaren Attribute sowie Links zur Referenzdokumentation. Dort erfahren Sie, welche Elemente die Attribute unterstützen und wie sie funktionieren.
SVG-Attribute von A bis Z
A
B
C
D
E
F
G
H
I
K
L
M
N
O
P
R
S
scaleseedshape-renderingsideslopespacingspecularConstantspecularExponentspreadMethodstartOffsetstdDeviationstitchTilesstop-colorstop-opacitystrokestroke-dasharraystroke-dashoffsetstroke-linecapstroke-linejoinstroke-miterlimitstroke-opacitystroke-widthstylesurfaceScalesystemLanguage
T
U
V
W
X
Y
Z
SVG-Attribute nach Kategorie
Kernattribute
Die Kernattribute sind globale Attribute.
Attribute für die bedingte Verarbeitung
Diese Attribute steuern, ob die Elemente, für die sie festgelegt sind, verarbeitet werden.
XLink-Attribute
Mit XLink-Attributen kann auf Ressourcen verwiesen werden.
Präsentationsattribute
SVG-Präsentationsattribute sind SVG-Attribute, die auf SVG-Elementen auch als CSS-Eigenschaften verwendet werden können.
Sie legen CSS-Eigenschaftswerte für ein Element mit einer Spezifität von 0 fest. Daher können andere vom Autor definierte Stile in einem Stylesheet oder im Attribut style sie überschreiben.
Die Werte von Präsentationsattributen werden als CSS-Werte und nicht als Deklarationen geparst; sie können daher kein !important enthalten.
Die meisten Präsentationsattribute werden vererbt, wenn sie als CSS-Eigenschaften verwendet werden (beispielsweise fill und stroke).
Die wichtigste Ausnahme sind Geometrieeigenschaften: Ihre CSS-Gegenstücke werden nicht vererbt.
alignment-baselinebaseline-shiftclipclip-pathclip-rulecolorcolor-interpolationcolor-interpolation-filterscursorcxcyddirectiondisplaydominant-baselinefillfill-opacityfill-rulefilterflood-colorflood-opacityfont-familyfont-sizefont-size-adjustfont-stretchfont-stylefont-variantfont-weightfont-widthglyph-orientation-horizontalglyph-orientation-verticalheightimage-renderingletter-spacinglighting-colormarker-endmarker-midmarker-startmaskmask-typeopacityoverflowpathLengthpointer-eventsrrxryshape-renderingstop-colorstop-opacitystrokestroke-dasharraystroke-dashoffsetstroke-linecapstroke-linejoinstroke-miterlimitstroke-opacitystroke-widthtext-anchortext-decorationtext-overflowtext-renderingtransformtransform-originunicode-bidivector-effectvisibilitywidthwhite-spaceword-spacingwriting-modexy
Geometrieeigenschaften
Geometrieeigenschaften beschreiben die Position und Abmessungen von SVG-Formen. In SVG 2 bilden sie eine definierte Teilmenge der Präsentationsattribute, deren CSS-Gegenstücke nicht vererbt werden.
Jede Geometrieeigenschaft kann nur bei bestimmten Elementen als Präsentationsattribut verwendet werden.
Beispielsweise definiert r den Radius eines <circle>, hat aber keine Auswirkung auf Elemente wie <rect>.
Die SVG-Geometrieeigenschaften sind:
Welche Eigenschaften für welche Elemente gelten, erfahren Sie auf der jeweiligen Attributseite und in der Liste auf der Seite zum Element <g>.
Filterattribute
Animationsattribute
Ereignisattribute
Alle HTML- und SVG-Elemente unterstützen die im Mixin GlobalEventHandlers definierten Attribute für Ereignisbehandler.
Attribute für Ereignisbehandler wie onblur und onauxclick gelten zwar für alle Elemente, haben aber möglicherweise keine Wirkung. Beispielsweise kann das Attribut oncuechange auf jedes Element angewendet werden, ist aber nur für das Element <track> relevant.
Von der Verwendung von Attributen für Ereignisbehandler wird abgeraten. Sie gelten als unsicher und können durch Content Security Policies (CSP) blockiert werden. Verwenden Sie stattdessen den Ereignisnamen in der Methode addEventListener().