CSS：a：悬停img没有背景？

Question

我的链接上有背景颜色（悬停，轨道样式）。我在一个标签里面有一个img，我不想在悬停中有背景。

我试过

a:hover img{ background-color: #fff; }

但那没有做任何事情。如何从悬停中排除a-tags内的img-tag？

THX， MRB

编辑：jsFiddle

http://jsfiddle.net/rasvf/1/

在示例中：“google”在悬停时具有红色背景，如预期。但是当你将鼠标悬停在图像上时，它也可以。它应该没有悬停背景。

Answer 1

如果我理解正确，我认为你正在尝试这样做：

a:hover img{ visibility: hidden; }

或

a:hover img{ display: none; }

修改

在这种情况下，您需要：

a:hover img {background-color: transparent;}

发布于http://jsfiddle.net/6qwJy/

的示例

Answer 2

很难理解你的例子。说我有这段HT​​ML：

<a class="foo" href="#"><img src="bar.gif"/> Click me</a>

然后使用这些样式规则

a#foo:hover { background-color: blue; }
a#foo img { background-color: white; }

图像背景颜色始终为白色，也在悬停时。

但是，如果您在包含链接的元素上有背景图像，并且您希望它显示在前景图像后面，那么您无法执行此操作。在这种情况下，您必须在一个范围中包含链接的“Click me”文本并在样式表中写入：

a#foo:hover span { background-color: blue; }

这是你的意图吗？

Answer 3

啊！我做的。简单。我只是将不具有背景图像放在不同的div中，然后做了：

.otherdiv a:hover{ background-color: transparent; }

Answer 4

a img {
    vertical-align: bottom;
}

Answer 5

好的，你不会相信我，但我上面遇到了同样的问题，我解决了如下问题：

我有这样的事情：

<a href="#"> {
{1}} {
{1}}

在我的CSS中，我有：

<img src"path/to/image.gif">

而且，相信我，我只需要将'img'标记放在与'a'标记相同的行中，就像这样：

</a>

这就是全部!!!