网页开发中SVG格式的外部图片相对于png/jpg格式的使用并不算少，那么既然用到了SVG我们在html页面中如何引入svg格式的图片呢？

页面中嵌入SVG格式的五种方法：

1、<img/>标签的使用：

<img src="img.svg"/>

注：如果你需要在图片上添加click等事件，建议使用该方法。至于原因就不多加解释，你去实际操作就知道有多大问题了！

2、当做背景图使用：

.img{background:url(img.svg)}

3、用<object>标签引入：

<object type="image/svg+xml" data="img.svg">
</object>

4、<iframe>标签引入：

<iframe src="img.svg"></iframe>

5、<embed>标签引入

<embed type="image/svg+xml" src="img.svg" /><embed>

结语：以上几种方法均能正确引入svg格式图片，但如果你需要SVG图片上添加点击等事件，那么建议使用第一种或者第二种方法来引入图片。

参考资料：

https://www.smashingmagazine.com/2014/11/styling-and-animating-svgs-with-css/