将svg添加到网页？

Question

如何将svg添加到我的网页并通过css更改颜色？

我试过了:

<img src="my.svg" class="svg"/>

.svg{
    fill: white;
}

但没有运气.

只有CSS解决方案,我不需要任何后备,只支持新的浏览器.

Answer 1

这样是行不通的。如果直接包含 svg，则可以更改填充颜色，即：

HTML：

<p>Some other webpage content</p>
<svg class="my-svg">
    <g>
        <path fill="..."></path>
        <path fill="..."></path>
    </g>
</svg>
<p>Some other webpage content</p>

CSS：

.my-svg *{
    fill:white;
}

因此，您进行网络检查my.svg，并将其内容复制粘贴到目标页面。然后你就可以设计它了。