HTML
<img src="logo.svg" alt="Logo" class="logo-img">
CSS
.logo-img path {
fill: #000;
}
上面的svg加载并且是本机的fill:#fff但是当我使用上面的css尝试将它更改为黑色时，它没有改变，这是我第一次使用svg并且我不确定它为什么不工作。
如果您的目标只是改变徽标的颜色，而不一定需要使用CSS，那么就不要像前面一些答案所建议的那样使用javascript或jquery。
要准确地回答原来的问题，只需：
>
在文本编辑器中打开logo.svg。
查找填充:#fff并将其替换为填充:#000
例如，logo.svg在文本编辑器中打开时可能如下所示：
<svg fill="#000000" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
<path d="M0 0h24v24H0z" fill="none"/>
<path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z" fill="#fff"/>
</svg>
…只需更改填充并保存即可。
您可以将SVG设置为掩码。这样，设置一个背景颜色就可以作为填充颜色。
HTML
<div class="logo"></div>
CSS
.logo {
background-color: red;
-webkit-mask: url(logo.svg) no-repeat center;
mask: url(logo.svg) no-repeat center;
}
jsfiddle:https://jsfidle.net/kuhltime/2j8exgcb/
mdn:https://developer.mozilla.org/en-us/docs/web/css/mask
请检查您的浏览器是否支持此功能:https://caniuse.com/#search=mask
