SVG is based on XML so consists of a series of nested elements within an SVG element. You can create an svg file by creating a new text file and changing its file extension to .svg. You can edit its contents in any text-editor.
Elements consist of a start tag, which looks something like <tag>, some contents, and an end tag, which looks like </tag>. Tags must always be closed. If an element does not contain any contents (which is more common in SVG than in most XML documents), then is can simply be a self-closing tag, which looks like this <tag/>.
Some examples of tags used in SVG are <line>, <rect> <text> and <style>. Tags can written in uppercase, lowercase, or any mix of the two. The contents of elements (what appears between the start and end tags) can be text (for example, in <text> tags) or other elements (for example in the group tag, <g>).
Tags may also contain attributes, which define the properties of that element. Attributes have the form name="value", and are put in a start tag, after the tag's name but before the closing '>'. An element can contain any number of attributes and each must be separated by a space (or any amount of whitespace, including new lines). Elements have specific attributes that determine their appearance. If any of these attributes is missing it will default to zero.
For example, a line is defined by the attributes x1, y1, x2 and y2. Changing the value of these attributes changes the appearance of the element. (You also have to set the stroke to equal a colour, otherwise the line won't show up.)
<svg xmlns="http://www.w3.org/2000/svg"> <line x1="40" y1="30" x2="240" y2="100" stroke="black" /> </svg>
Click and drag the end points or the attribute values to move the line.
There are additional attributes that can control the style of elements, which I will describe later. Attributes that have no function are ignored (which can be useful for scripting effects).
The SVG tag
As stated at the beginning of this post, an SVG consists of element inside an SVG element. An SVG must therefore start with <svg> and end with </svg>. Often SVGs will start with a DOCTYPE declaration, but according to these SVG authoring guidelines there's no need. Those guidelines suggest that you include version="1.1" and baseProfile="full" but it's not really necessary.
You can include height and width attributes to give the SVG a fixed size, otherwise it will fill the available space. You can use the viewBox attribute to define the range of values shown in the SVG.