多个SVG图形集成到一个SVG图形上

SVG：使用XML格式定义图像的可缩放矢量图形(Scalable Vector Graphics)。

优点就不多说了，下面看看怎么将多个svg图形集成到一个svg图形上。

如果使用bootstrap框架来开发前端页面的话，会发现字体图标glyphicon很好用，可以用<span class="glyphicon glyphicon-search"><span>的格式来随时调用icon，但是bootstrap的图标很少，往往很多常见图标里面没有。那么我们就想到了专门和bootstrap搭配使用的图标库Font Awesome ，这个图标库里面有很多图标，能满足基本需求，但是如果我们想个性化定制图标呢？比如说到目前为止（2016/07/28）最新的Font Awesome 4.6.3，我想找个QQ空间的图标，里面没有，想找新浪微博的图标，里面只有一个很丑的图标，怎么办呢？

　　最简单的方法，首先到阿里巴巴矢量图标库 http://www.iconfont.cn/ 去下载svg格式的图形。搜qzone，选择其中一个，点击SVG下载：

同样下载一个新浪微博的svg图形。

然后用编辑器打开图形，本文采用的是brackets编辑器，会看到如下代码：