Jump to content
  • 0

Проблема с a:hover img


Sergikus
 Share

Question

Добрый день.

Я, по сути, начинающий верстальщий, но сегодня столкнулся такой проблемой. Заказчик попросил что бы при наведении на ссылку у нее изменялся бекфон. Когда прописал соответствующий стиль, появилась проблема с ссылочными изображениями с прозрачным фоном. Если навести на них мышкой, фон изображения тоже меняется. В общем какие варианты я не пробовал, без результатно. Хочу попросить помощи у опытных верстальщиков. Код примера привожу ниже

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Standart//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<title></title>

<style type="text/css">

a, a:active, a:link, a:visited {

color:#016eea;text-decoration:none;

}

a:hover {

background-color: #016eea;

color: #fff;

text-decoration: none;

}

a:hover img {

background-color: #fff !important;

border:0;

text-decoration:none;

}

</style>

</head>

<body>

<a href="#">Hello</a>

<br><br>

<div><a href="#"><img src="/img/myimg.gif" border="0"></a></div>

</body>

</html>

Есть один маленький нюанс. Если ссылке с рисунком присвоить класс и описать его в css, тогда все работает корректно. Но, этого сделать нет возможности, т.к. контент на сайт добавляют контент менеджеры через CMS и там получаются голые теги. Объяснить им что такое CSS классы нет возможности. Плюс есть много добавленного контента, который нет возможности изменять. Да, и еще, вариант img {display:block} не подходит, хоть и решает данную проблему, т.к. не во всех изображениях заданы размеры.

Буду очень благодарен, если кто-то подскажет как решить данную проблему.

Link to comment
Share on other sites

5 answers to this question

Recommended Posts

  • 0

Сделай картинку(скриншот) того как должно быть

Выложил пример: http://griph1n1.com.ua/example/

При наведении на изображение появляется синий бекфон.

Задача что бы этого бекфона не было.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy