SVG/Element/defs

Das defs-Element legt einen Definitionsabschnitt fest, der vom Browser nicht gerendert wird. Dieser kann script- und style-Elemente, sowie Farbverläufe, Muster oder Filter und andere Objekte enthalten.

In Definitionsabschnitten enthaltene Objekte oder Animationspfade werden nicht dargestellt, sondern nur definiert. Wenn du diese Objekte mit einer ID versiehst, kannst du sie im Hauptteil durch url(#element_id) referenzieren und beliebig oft einfügen.

Syntax

Start-Tag: notwendig

End-Tag: notwendig

Elternelemente

Darf vorkommen in:
svg

erlaubte Inhalte

• Animations-Elemente
• Beschreibungs-Elemente
• Container-Elemente
• grafische Elemente
• clipPath, filter, foreignObject, image, linearGradient, radialGradient, script, style, text, view

Attribute

Name	Inhalt	Standardwert	Bedeutung
transform	CDATA

Attribut: Pflichtattribut
Attribut: optionales Attribut

Beispiel

<svg> <defs> <linearGradient id="verlauf1" x1="0%" y1="0%" x2="0%" y2="100%"> <stop offset="0%" stop-color="#dfac20" /> <stop offset="100%" stop-color="#337599" /> </linearGradient> <linearGradient id="verlauf2" x1="0%" y1="0%" x2="100%" y2="0%"> <stop offset="0%" stop-color="#dfac20" /> <stop offset="100%" stop-color="#3983ab" /> </linearGradient> <linearGradient id="verlauf3" x1="0%" y1="0%" x2="100%" y2="100%"> <stop offset="0%" stop-color="#dfac20" /> <stop offset="100%" stop-color="#337599" /> </linearGradient> </defs> <rect id="eins" fill="url(#verlauf1)" /> <rect id="zwei" fill="url(#verlauf2)" /> <rect id="drei" fill="url(#verlauf3)" /> </svg>

Weblinks

• W3C: The defs-Element