更改SVG路径嵌入到按钮

Question

我可以很容易地更改SVG路径，但是当我将它插入按钮时，CSS：hover在Firefox中不起作用。请检查JSfiddle demo

CSS：

#Fill-1 { 
    fill: red; 
} 
#Fill-1:hover { 
    fill: black; 
} 

Answer 1

Button类似乎并没有搞乱任何东西。你应该尝试改变CSS来指向Button而不是＃Fill-1和＃Fill-2。他们不需要。

button {fill:red} 
button:hover {fill:black} 

Answer 2

该按钮吞下鼠标事件，所以SVG从不会获取它们。尽管将鼠标悬停在按钮上可以使悬停工作成为可能。您需要确保您定位的项目没有内嵌填充属性，以便按钮的填充可以对其进行设置。

button { 
    fill:red; 
} 
button:hover { 
    fill:black; 
} 

like so

有一个Firefox bug跟踪这个