我在我的页面上将一个SVG图像文件包含在object标记内，如下所示:
<object type="image/svg+xml" data="linkto/image.svg">
<!-- fallback image in CSS -->
</object>
所讨论的图像是一张世界 map ，我想在鼠标悬停在group上时转换fill属性，在本例中，我按大陆对SVG进行了分组，因此南美洲看起来像这样:
<g id="south_america">
<path fill="#FAFAFA" d="(edited for brevity)"/>
</g>
通过在SVG文档顶部使用以下CSS，我可以让fill属性在悬停时更改:
<style>
#south_america path {
transition: fill .4s ease;
}
#south_america:hover path {
fill:white;
}
</style>
但是我不能让fill色在CSS转换中褪色， colored颜色 只是瞬间改变，有人能解释一下吗？