SVG-Leitfäden

Diese Seite listet Leitfäden für SVG auf.

Auftragen von SVG-Effekten auf HTML-Inhalt: Moderne Browser unterstützen die Verwendung von SVG innerhalb von CSS-Stilen, um grafische Effekte auf HTML-Inhalt anzuwenden.
Einführung in SVG in HTML: Dieser Artikel und das dazugehörige Beispiel zeigen, wie Sie eingebettetes SVG verwenden können.
Inhaltstyp: SVG verwendet eine Reihe von Datentypen. Dieser Artikel listet diese Typen zusammen mit ihrer Syntax und Beschreibung ihrer Verwendung auf.
Namespaces-Crashkurs: Als ein XML-Dialekt ist SVG namensbasiert. Es ist wichtig, das Konzept der Namespaces zu verstehen und wie sie verwendet werden, wenn Sie vorhaben, SVG-Inhalte zu erstellen. Namespaces sind essenziell für Benutzeragenten, die mehrere XML-Dialekte unterstützen; Browser müssen sehr strikt sein. Jetzt die Zeit zu investieren, um Namespaces zu verstehen, wird Ihnen in Zukunft einige Kopfschmerzen ersparen.
Skripting: Man kann Standardverhalten des Browsers mit der Methode evt.preventDefault() überschreiben, Event-Listener zu Objekten mit der Syntax element.addEventListener(event, function, useCapture) hinzufügen und Eigenschaften von Elementen mit einer Syntax wie svgElement.style.setProperty("fill-opacity", "0.0", "") setzen. Beachten Sie, dass alle drei Argumente beim Setzen von Eigenschaften vorhanden sind.
SVG als Bild: SVG-Bilder können in verschiedenen Kontexten als Bildformat verwendet werden. Browser unterstützen SVG-Bilder in:
SVG-Animation mit SMIL: Synchronisiertes Multimedia-Integrationssprache (SMIL) ist eine XML-basierte Sprache zur Erstellung interaktiver Multimedia-Präsentationen. Autoren können die SMIL-Syntax in anderen XML-basierten Sprachen verwenden, um das Timing und Layout von Elementen für Animationen zu definieren. SMIL ermöglicht Ihnen:
SVG-Filter: SVG ermöglicht es uns, ähnliche Werkzeuge wie die Bitmap-Beschreibungssprache zu verwenden, wie z. B. Schatten-, Unschärfeeffekte oder sogar das Zusammenführen der Ergebnisse verschiedener Filter. Mit dem Filterelement <filter> ist es möglich, diese Effekte hinzuzufügen und später an ein Objekt anzuhängen.
Verlinkung: Das target-Attribut des SVG a-Elements funktioniert nicht in Mozilla Firefox 1.5. Wenn SVG-Dokumente innerhalb eines übergeordneten HTML-Dokuments eingebettet werden, verwenden Sie den Tag: