SVG 是一种基于 XML 语法的图像格式，全称是可缩放矢量图（Scalable Vector Graphics）。其他图像格式都是基于像素处理的，SVG 则是属于对图像的形状描述，所以它本质上是文本文件，体积较小，且不管放大多少倍都不会失真。
SVG 文件可以直接插入网页，成为 DOM 的一部分，然后用 JavaScript 和 CSS 进行操作。
SVG 代码直接插入网页的例子。
<!DOCTYPE html>
<html>
<head></head>
<body>
<svg
id="mysvg"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 800 600"
preserveAspectRatio="xMidYMid meet"
>
<circle id="mycircle" cx="400" cy="300" r="50" />
<svg>
</body>
</html>
SVG 代码也可以写在一个独立文件中，然后用<img>、<object>、<embed>、<iframe>等标签插入网页。
<img src="circle.svg">
<object id="object" data="circle.svg" type="image/svg xml"></object>
<embed id="embed" src="icon.svg" type="image/svg xml">
<iframe id="iframe" src="icon.svg"></iframe>
CSS 也可以使用 SVG 文件。
.logo {
background: url(icon.svg);
}
SVG 文件还可以转为 BASE64 编码，然后作为 Data URI 写入网页。
<img src="data:image/svg xml;base64,[data]">
SVG是基于XML，由W3C制定的一种二维矢量图形格式，任意缩放不失真，因为文件小，下载比jpg和png快，文本独立，即便用户没有下载该文字，也不影响效果，超强边缘显示，适用各种屏幕分辨率和打印分辨率，超强颜色控制，提供有一个1600万种颜色的调色板，支持IE9、Firefox、opera、chrome、Safari。低版本需要插件。
例如：直线、曲线等等。或者只要你想，你也可以在矢量图形编辑程序中创建这些直线、曲线，然后让程序导出代码。
为什么要选择SVG？主要有这几方面的原因：
- SVG 是可伸缩的矢量图形，在浏览器中改变尺寸，其图形质量不会有所损失。
- 相比其它位图，SVG图像文件更小，可压缩性更强。
- SVG 可以被记事本等阅读器、搜索引擎访问。
- SVG 图像中的文本是可选的，同时也是可复制的。
- SVG 图像可以与DOM，CSS和JavaScript交互。
- SVG 可以制作成整体或局部动画。
SVG 与 Flash 类似，都是用于二维矢量图形，二者的区别在于，SVG 是一个 W3C 标准，基于 XML，是开放的。因为是 W3C 标准，SVG 与其他的 W3C 标准，比如 CSS、DOM 和 SMIL 等能够协同工作。
SVG是W3C XML的分支语言之一，用于标记可缩放的矢量图形。即便浏览器实现了一些规范，但实现速度完全不能和它的竞争技术相比，它的竞争技术比如说HTML Canvas和Adobe Flash，都已经实现了成熟的应用接口。但是SVG也有自身的优点，比如它实现了DOM接口（比Canvas方便），不需要安装第三方插件就可以在浏览器中使用（比Flash方便）。当然，是否使用SVG还要取决于你要实现什么。
说说您对svg的看法……我来聊一聊。
,
