CSS Hover对svg对象中的子元素的影响

Question

我正在尝试将css填充颜色应用于它的父<a>元素的悬停事件上的svg对象。

在非svg元素上，这可以工作：

.icon {
    background-color: #000;
}

a:hover .icon {
    background-color: #666
}

但是当使用svg对象时，svg文件将类.icon应用于<svg>元素......

<a href="#">
    <object type="image/svg+xml" data="icon.svg"></object>
</a>

它不起作用。

.icon {
    fill: #000;
}

a:hover .icon {
    fill: #666
}

应用黑色填充，但悬停不起作用。如果我直接将填充应用于.icon：悬停，它可以工作，但<a>大于图标并具有其他元素，因此如果链接正在悬停，则图标不一定悬停。< / p>