svg其实不算新标准吧，在dom标准定义的时候好像就有了，记得在高级编程那本书上看过的，但一直到html5，才是所有的浏览器都支持了，我们使用一张svg图的时候，最简单的用法就是像使用传统的图片一样去使用，还有就是svg跟css结合的使用，这个个人接触的少就不在此乱扯了，主要写写字体方面的。
其实字体呢就是自定义在css中content（content的使用可以去w3c看看，要配合before跟after伪类一起的，指定一个url作为内容），而这个url指向的是一个自定义的font，具体代码如下：
1 @font-face { 2 font-family: 'icomoon'; /*注意这里的路径别弄错了*/ 3 src:url('icomoon.eot?418ycv'); 4 src:url('icomoon.eot?#iefix418ycv') format('embedded-opentype'), 5 url('icomoon.woff?418ycv') format('woff'), 6 url('icomoon.ttf?418ycv') format('truetype'), 7 url('icomoon.svg?418ycv#icomoon') format('svg'); 8 font-weight: normal; 9 font-style: normal; 10 } 11 12 [class^="icon-"], [class*=" icon-"] { 13 font-family: 'icomoon'; 14 speak: none; 15 font-style: normal; 16 font-weight: normal; 17 font-variant: normal; 18 text-transform: none; 19 line-height: 1; 20 21 /* Better Font Rendering =========== */ 22 -webkit-font-smoothing: antialiased; 23 -moz-osx-font-smoothing: grayscale; 24 }
这个声明了以 “icon-” 开头的class的font-family为你所指定的字体文件的字体格式，然后对每一个具体的字体是这样的：
.icon-Add:before { content: "\e600"; }
这样就完成了对一个svg字体的引用，你只需要在页面上的元素中声明class="icon-Add",然后就可以引用到你指定字体文件中对应的那个小svg图片，你也可以像使用普通字体一样去修改他的颜色，调整它的font-size，设置hover时候的颜色，等等，总之跟你使用普通的问题没有多少区别。
最后，附带上阿里巴巴的一个链接，可以上传一组svg图标然后转换成字体，可以定制自己需要的部分svg图标，拥有着很丰富的图标库，你可以尽情的选择你需要的，最后download的结果是一个icomoon的文件夹，包含一个demo.html，你只需要把font文件夹下的全部内容以及stlye.css引入即可，要注意style.css开始为的关于引用字体文件的路径别弄错了，这样你就可以直接使用了，刚好那个demo.html可以作为一个很好的查阅工具，就写这么多吧。
字体应用链接地址：https://icomoon.io/app/#/select/font
