svg 是Scalable Vector Graphics意为可缩放矢量图形，SVG使用XML格式定义二维图形和绘图程序的语言。
实例
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<circle cx="100" cy="50" r="40" stroke="black"
stroke-width="2" fill="red" />
</svg> 第一行包含了XML声明，standalone属性规定此svg文件是否是“独立的”，或含有对外部文件的引用。在这里，引用了个部的DTD文件。
第二行和第三行引用了外部的SVG DTD，该DTD位于W3C，含有所有允许的SVG元素。
SVG代码以<svg>元素开始，包括开启标签<svg>和关闭标签</svg>。这是根元互， width和height属性可设置此svg文档的宽度和高度。version属性可定义所用的svg版本，xmlns属性可定义svg命名空间。
svg在html页面
svg文件可通过以下标签嵌入HTML文档：<embed> <object>或者<iframe>
1. 使用<embed>标签
<embed src="circle1.svg" type="image/svg+xml"/>所有主要浏览器都支持，并允许使用脚本。
2. 使用<object>标签
<object data="circle1.svg" type="image/svg+xml"></object>所有主要浏览器都支持，不允许使用脚本。
3. 使用<iframe>
<iframe src="circle1.svg"></iframe>所有浏览器都支持，并允许使用脚本。
4、在Firefox chrome中，还可以直接在HTML中写入svg代码。
SVG形状
1、<rect>
rect元素的width和height属性可定义矩形的高度和宽度，style属性用来定义css属性，css的fill属性定义矩形的填充颜色，stroke-width属性定义矩形边框的宽度，stroke属性定义矩形边框的颜色。
2、<circle>
创建一个圆，cx和cy属性定义圆点的x和y坐标，如果省略cx和cy，圆的中心点为（0，0），r属性定义圆的半径。
3、<ellipse>
椭圆和圆相似，不同之处在于椭圆有不同的x和y半径。
cx,cy定义椭圆中心，rx定义水平半径，ry定义垂直半径。
4、<line>
用来创建一个直线，x1 y1定义线条的开始，x2 y2定义线条的结束。
5、<polygon>
多边形，points属性定义多边形每个角的x和y坐标。
6、<polyline>
创建任何只有直线的形状。
points属性定义每个直线的起始和结束 。
7、<path>
定义一个路径
(1) M=moveto
(2) L=lineto
(3)H=horizontal lineto
(4) V=vertical lineto
(5) C=curveto
(6) S=smooth curveto
(7) Q=quadratic Bezier curve
(8) T=smooth quadratic Bezier curve
(9) A=elliptical Arc
(10) Z=closepath
以上所有命令均允许小定字母，大写表示绝对定位，小写表示相对定位。
8、<text>
定义一个文本。