SVG guides
This page lists guides for SVG, covering topics such as embedding, MIME (media) types, handling scripts, animations, filters, and more.
- Applying SVG effects to HTML content
Modern browsers support using SVG within CSS styles to apply graphical effects to HTML content.
- Content type
SVG makes use of a number of data types. This article lists these types along with their syntax and descriptions of what they're used for.
- Linking
The
targetattribute on the SVGaelement doesn't work in Mozilla Firefox 1.5. When SVG documents are embedded within a parent HTML document using the tag:- Namespaces crash course
As an XML dialect, SVG is namespaced. It is important to understand the concept of namespaces and how they are used if you plan to author SVG content. Namespaces are essential to user agents that support multiple XML dialects; browsers must be very strict. Taking the time to understand namespaces now will save you from future headaches.
- Scripting
There are several ways to create and manipulate SVG using JavaScript. This document describes event handling, interactivity and working with embedded SVG content.
- SVG animation with SMIL
Synchronized Multimedia Integration Language (SMIL) is an XML-based language for writing interactive multimedia presentations. Authors can use SMIL syntax in other XML-based languages to define the timing and layout of elements for animation.
- SVG as an image
SVG can be used as an image format in HTML, CSS, certain SVG elements, and via the Canvas API. This page lists the features where you can provide SVG as an image source.
- SVG filters
SVG allows us to use similar tools as the bitmap description language such as the use of shadow, blur effects or even merging the results of different filters. With the filter element
<filter>it is possible to add these effects and later on attach them to an object.- SVG in HTML introduction
This article and its associated example shows how to use inline SVG.