SVG-Attribut-Referenz
SVG-Elemente können mit Hilfe von Attributen verändert werden, die beeinflussen, wie das Element gehandhabt oder gerendert wird.
Unten finden Sie eine Liste aller in SVG verfügbaren Attribute, zusammen mit Links zur Referenzdokumentation, die Ihnen dabei helfen, zu lernen, welche Elemente sie 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.
Bedingte Verarbeitungsattribute
Die bedingten Verarbeitungsattribute steuern, ob die Elemente, auf denen sie gesetzt sind, verarbeitet werden.
XLink-Attribute
Die XLink-Attribute können Ressourcen referenzieren.
Präsentationsattribute
SVG-Präsentationsattribute sind SVG-Attribute, die auch als CSS-Eigenschaften auf SVG-Elementen verwendet werden können. Sie setzen CSS-Eigenschaften für ein Element mit einer Spezifität von 0, sodass andere Autorenstile in einem Stylesheet oder style-Attribut sie überschreiben können. Präsentationsattributwerte werden als CSS-Werte und nicht als Deklarationen geparst, daher können sie nicht !important enthalten.
Die meisten Präsentationsattribute erben, wenn sie als CSS-Eigenschaften verwendet werden (z. B. fill und stroke). Geometrie-Eigenschaften sind die Hauptausnahme: Ihre CSS-Gegenstücke erben nicht.
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-typeopacityoverflowpointer-eventsrrxryshape-renderingstop-colorstop-opacitystrokestroke-dasharraystroke-dashoffsetstroke-linecapstroke-linejoinstroke-miterlimitstroke-opacitystroke-widthtext-anchortext-decorationtext-overflowtext-renderingtransformtransform-originunicode-bidivector-effectvisibilitywidthwhite-spaceword-spacingwriting-modexy
Geometrie-Eigenschaften
Geometrie-Eigenschaften beschreiben die Position und Dimensionen von SVG-Formen. In SVG 2 sind sie eine definierte Untermenge von Präsentationsattributen, deren CSS-Gegenstücke nicht erben.
Jede Geometrie-Eigenschaft gilt als Präsentationsattribut nur auf bestimmten Elementen. Zum Beispiel definiert r den Radius eines <circle>, hat aber keinen Effekt auf Elemente wie <rect>.
Die SVG-Geometrie-Eigenschaften sind:
Für anwendungsspezifische Informationen finden Sie auf den Attributseiten der jeweiligen Eigenschaften und auf der Liste auf der Seite des <g>-Elements.
Filter-Attribute
Animationsattribute
Ereignisattribute
Alle HTML- und SVG-Elemente unterstützen Ereignis-Handler-Attribute, die im GlobalEventHandlers Mixin definiert sind.
Während Ereignis-Handler-Attribute, wie onblur und onauxclick, auf alle Elemente angewendet werden können, haben sie möglicherweise keinen Effekt. Zum Beispiel kann das oncuechange Attribut auf jedes Element angewendet werden, ist aber nur für das <track> Element relevant.
Ereignis-Handler-Attribute werden nicht empfohlen, da sie als unsicher gelten und durch Content Security Policies (CSP) blockiert werden können. Verwenden Sie stattdessen den Ereignisnamen innerhalb einer addEventListener() Methode.