你能用CSS修改加载的SVG背景图像吗？

Question

我们首次使用SVG作为基于移动HTML5的应用精灵文件（它们可以轻松处理视网膜其他屏幕尺寸差异）。

我知道生成的SVG可以直接操作（因为它们是文本文件）但是可以通过CSS或脚本修改SVG资产（在这种情况下，是通过CSS加载的背景图像）吗？

例如，我们可以加载一个全黑的SVG对象，然后将其更改为白色吗？

Answer 1

如果SVG文件的DOM作为图像加载（通过img或background-image），则无法访问它。你不能通过CSS设置样式。

如果您打算进行这些操作，则应将SVG附加到div。你应该仍然能够对该div执行精灵般的操作。您可以通过CSS或javascript设置样式。

---

应该内联SVG。您可以将SVG复制并粘贴到以前包含background-image的div中，或通过ajax请求将其加载到那里。

您可以使用background-position或left制作动画，而非动画-webkit-transform: translate(...)。