SVG-Leitfäden

Diese Seite listet Leitfäden für SVG auf und behandelt Themen wie das Einbetten, MIME (Medien)-Typen, Umgang mit Skripten, Animationen, Filter und mehr.

Anwenden von SVG-Effekten auf HTML-Inhalte

Moderne Browser unterstützen die Verwendung von SVG innerhalb von CSS-Stilen, um grafische Effekte auf HTML-Inhalte anzuwenden.

Ein Schnellkurs zu Namespaces

Als XML-Dialekt ist SVG namensraumbezogen. Es ist wichtig, das Konzept der Namespaces zu verstehen und wie sie verwendet werden, wenn Sie vorhaben, SVG-Inhalte zu erstellen. Namespaces sind unerlässlich für Benutzeragenten, die mehrere XML-Dialekte unterstützen; Browser müssen sehr strikt sein. Sich jetzt die Zeit zu nehmen, Namespaces zu verstehen, wird Ihnen in Zukunft Kopfschmerzen ersparen.

Einführung in SVG in HTML

Dieser Artikel und das zugehörige Beispiel zeigen, wie man eingebettetes SVG verwendet.

Inhaltstyp

SVG verwendet eine Reihe von Datentypen. Dieser Artikel listet diese Typen zusammen mit ihrer Syntax und Beschreibungen ihrer Verwendungszwecke auf.

Skripting

Es gibt mehrere Möglichkeiten, SVG mit JavaScript zu erstellen und zu manipulieren. Dieses Dokument beschreibt die Ereignisbehandlung, Interaktivität und die Arbeit mit eingebetteten SVG-Inhalten.

SVG als Bild

SVG kann als Bildformat in HTML, CSS, bestimmten SVG-Elementen und über die Canvas-API verwendet werden. Diese Seite listet die Funktionen auf, bei denen Sie SVG als Bildquelle angeben können.

SVG-Animation mit SMIL

Synchronized Multimedia Integration Language (SMIL) ist eine auf XML basierende Sprache zur Erstellung interaktiver Multimedia-Präsentationen. Autoren können SMIL-Syntax in anderen XML-basierten Sprachen verwenden, um das Timing und Layout von Elementen für Animationen zu definieren.

SVG-Filter

SVG ermöglicht es uns, ähnliche Werkzeuge wie die Bitmap-Beschreibungssprache zu verwenden, wie etwa die Nutzung von Schatten-, Unschärfeeffekten oder sogar das Zusammenführen der Ergebnisse verschiedener Filter. Mit dem Filter-Element <filter> ist es möglich, diese Effekte hinzuzufügen und später an ein Objekt anzuhängen.

Verlinkung

Das target Attribut auf dem SVG a Element funktioniert in Mozilla Firefox 1.5 nicht. Wenn SVG-Dokumente innerhalb eines übergeordneten HTML-Dokuments mit dem Tag eingebettet werden: