我刚开始在网页上试验SVG，我发现只能使用<object />标签将SVG图像添加到HTML中，而不是像我期望的那样将<img />添加到HTML中。大多数时候，我通过CSS向网页添加图形，因为它们是网站呈现的一部分，而不是内容。
我知道可以将CSS应用于SVG，但是可以使用纯CSS将矢量图像添加到HTML元素吗？
自Opera 9以来，<img>和CSS（列表图像，背景图像，内容）支持SVG。Opera 10更好。 Webkit / Safari也支持<img>中的svg。
一些examples here，更多的dev.opera.com和annevankesteren.nl
如果您正在寻找内联svg示例，请查看Sam Ruby's site。
您可以尝试使用content属性引用SVG文件，但我认为它不受支持。如果它受支持，它将如下所示：
.putapicturehere:before {
content: url(mysvgfile.svg);
}
这肯定不适用于IE - 它可能适用于最新的Firefox。
我总是reference quirksmode.org的css浏览器支持问题。
您可能需要制作一个CSS辅助JavaScript来从屏幕外的img中读取图像并将其放入对象标记中。这样你仍然可以用CSS控制。
据我所知，Opera 9和WebKit（== Safari和Chrome）在个人电脑上做到这一点，而且有传言说FF3.5也能用。
实际上，由于Apple在半年前就为iPhone的Safari添加了SVG支持，我不确定，如果它有效，但值得一试。
干杯，
上次我尝试，差不多一年前，它没有用。但是，您可以混合使用svg和xhtml标记。唯一的问题是页面必须具有正确的mime类型（application-xml或类似的东西）或浏览器将忽略svg。
如果你想要严格分离内容和表示，内联svg不是一个完美的解决方案，但似乎是使用svg最受支持的方式。