svg

Vektoren selber programmieren

  Hier findest du nur einen kleinen Einblick in weitläufiges Thema: SVG (="Scalable Vector Graphics"). Was du aber sicher merkst: SVG ist eine Sprache, die auch mit Tags und Attributen arbeitet! Hast du also das Prinzip von HTML begriffen, liegt dir ein weiteres Informatik-Feld zu Füssen!

<svg width="300" height="120">
	<rect width="280" height="90" stroke="#264de4" stroke-width="5" fill="#2a65f2" />
	<circle cx="60" cy="70" r="40" stroke="#e44e27" stroke-width="5" fill="#f1652a" />
</svg>

Vorschau (unformatiert)


Mit SVG-Grafiken kann man grundsätzlich auf zwei Arten umgehen:
1. Du platzierst den SVG-Code direkt im HTML-Code.
2. Du erstellst eine separate Textdatei und speicherst sie mit der Dateiendung ".svg" ab. Darauf kannst du die Grafik mit dem <img>-Tag in deiner Seite einbinden.

SVG mit Software zeichnen