SVG/Element/g

Das g-Element (group) fasst mehrere Objekte zu einer Gruppe zusammen. Deren Eigenschaften können Sie dann zentral festlegen.

Syntax

Start-Tag: notwendig

End-Tag: notwendig

Elternelemente

Darf vorkommen in:
alle Elemente

erlaubte Inhalte

Animationselemente, Beschreibungselemente, Container-Elemente, grafische Elemente clipPath, cursor, filter, foreignObject, image, linearGradient, radialGradient, script, style, text, view

Attribute

Name	Inhalt	Standardwert	Bedeutung
class	CDATA		ordnet ein Element einer oder mehreren Klassen zu.
style	CDATA
transform	CDATA

Attribut: Pflichtattribut
Attribut: optionales Attribut

Beispiel

<g id="auto">
	<path id="body" d="M30,50 v-15 h15 l15,-15 h30 l15,15 h15 v15z" />
	<circle id="wheel1" cx="50" cy="50" r="8" />
	<circle id="wheel2" cx="100" cy="50" r="8" />
</g>

Es werden drei Formen (ein Pfad und zwei Kreise) gruppiert. Die Stilangaben für Füllung, Randfarbe und -dicke werden zentral im g-Element festgelegt und an die Kindelemente vererbt.

Empfehlung: Wenn Sie mehrere Kindelemente einheitlich formatieren wollen, können Sie dies im g-Element tun. Die Formatierung wird dann auf die Kind-Elemente vererbt.

Siehe auch

• SVG/Tutorials/Gruppierungen

Weblinks

• W3C: The g Element