SVG：如何在外部 svg 精灵中更改符号"fill"颜色

Question

我在外部文件中有一个SVG Sprite symbols.svg，我使用这样的代码将Sprite的图像插入HTML文件：

<svg>
    <use xlink:href="symbols.svg#icon-twitter" />
</svg>

我想更改悬停在SVG图像的填充颜色，我该如何使用CSS？

Answer 1

<svg class="svg_hover">
    <use xlink:href="symbols.svg#icon-twitter" />
</svg>

CSS：

.svg_hover:hover{ fill: #f00; }