如何在HTML中使用SVG图像以允许下载PNG版本？

我有很多

.svg

图像，比如

foo23.svg

。我还有相应的

foo23.png

。我希望在我的HTML中使用SVG进行web浏览，但我希望它能够使您在右键单击（或控制单击）图像时，可以选择下载PNG。这能做到吗

目前我喜欢使用

插入图像。仍然可以使用

执行上述操作吗

---

我的问题的一个扩展来自

foo23.pdf

和

foo23.eps

。右键单击是否可以获得多个下载选项？

这是未经测试的，但我的方法是：

HTML:

这样，显示的图像应该是.svg文件（不适用于所有浏览器：），但提示保存的文件应该是.png文件

<img src="foo23.png" />

img {
    background-image: url(foo23.svg);
    background-repeat: no-repeat;
    height: 0;
    width: 0;
    padding: 35px 120px; // adjust that depend on your image size
}