CSS: a: hover img без фона?

Question

У меня есть цвет фона на моих ссылках (при наведении, в стиле рельсов).И у меня есть img внутри a-тега, для которого я не хочу иметь фон при наведении.

Я пробовал

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

, но это ничего не делает.Как исключить img-теги внутри a-тегов при наведении?

Thx, MrB

edit: jsFiddle

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

Впример: у "google" красный фон при наведении, как и предполагалось.Но когда вы наводите курсор мыши на изображение, это тоже происходит.Предполагается, что у него нет фона при наведении.

Answer 1

если я вас правильно понимаю, я думаю, вы пытаетесь сделать что-то вроде этого:

a:hover img{ visibility: hidden; }

или

a:hover img{ display: none; }

EDIT

В этом случае вы хотите:

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

Пример публикации: http://jsfiddle.net/6qwJy/

Answer 2

Хорошо, вы мне не поверите, но у меня была та же проблема, описанная выше, и я решил следующим образом:

У меня было что-то вроде этого:

<a href="#">
<img src"path/to/image.gif">
</a>

И в моем CSS у меня было:

a:hover { text-decoration: underline; }

И, поверьте мне, мне просто нужно было поместить тег 'img' в ту же строку, что и тег 'a', например:

<a href="#"><img src="path/to/img.gif"></a>

И это было все !!!

Answer 3

a img {
    vertical-align: bottom;
}

Answer 4

Ах! Я это сделал. Легко. Я просто поместил фоновое изображение «не иметь фона» в другой элемент div, а затем сделал:

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

Answer 5

Трудно понять твой пример. Скажем, у меня есть этот кусок HTML:

<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» в span и написать в своей таблице стилей:

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

Это то, что вы хотели?