：悬停影响超文本链接，而不是IMG链接

Question

我的HTML文件具有类似

<a href="foo.html"> 
    <img width="64" src="foo.svg" alt="foo"/> 
</a> 

和我的CSS文件中有

body 
{ 
    background: #FFF; 
} 
a:hover 
{ 
    background: #ABB; 
} 
img 
{ 
    background: #FFF; 
} 

这工作正常进行文本超链接。当悬停在文本超链接上时，背景颜色从FFF变为ABB。

但在这种情况下，img也是一个超链接，并且因为它的svg，它的背景显示。如何在徘徊时创建img更改的背景？使用此语法a:hover img { }

a:hover, 
a:hover img 
{ 
    background: #ABB; 
} 

Answer 1

尝试：

img 
{ 
    background: #FFF; 
} 

如果你想是背景改变的悬停主播，你必须为此做一个规则。

a:hover img 
{ 
    background: #F00; 
} 

否则，你需要确保图像的（html）背景是透明的，所以你只显示锚的背景。

如果您尝试将svg嵌入到页面中，并对某些元素使用CSS，那完全是另一回事。

Answer 2

你已经在为这项规则的图像背景