简介
SVG即可缩放矢量图形 (Scalable Vector Graphics)的简称, 是一种用来描述二维矢量图形的XML标记语言. SVG图形不依赖于分辨率, 因此图形不会因为放大而显示出明显的锯齿边缘.使用svg格式我们可以直接用代码来描绘图像，可以用任何文字处理工具打开svg图像，通过改变部分代码来使图像具有交互功能，并可以随时插入到HTML中通过浏览器来浏览。
优点：
- 缩放无损还原可设置颜色,大小,使用较灵活可利用CSS实现动画减少HTTP请求
缺点：
- SVG在绘制的性能上比PNG要差复杂的图形或渐变可能显示不全兼容性稍差
svg sprites
CSS sprites我们都很熟悉,将多个图标合在一个图片文件上,然后通过CSS设置背景图片的坐标来显示对应的部分.CSS sprites技术较成熟,兼容性好。但是缺点就是不够灵活,图标都是切死的,而且放大缩小会显示锯齿。所以如果需求里有图标是可变化的,可以尝试使用SVG图。如果有多个SVG图,可使用gulp-svg-symbols工具自动生成svg sprites图。
1.直接将SVG的代码添加在html中:
以上就上有关使用gulp工具生成svgsprites的全部内容，学步园全面介绍编程技术、操作系统、数据库、web前端技术等内容。