Направете фона зад логото на PNG прозрачен при задържане на мишката (за начинаещи)

Работя върху уебсайт и се боря с едно нещо. По принцип, когато задържите курсора на мишката над основното лого, фонът на логото става бял и изглежда ужасно. Опитах това в три различни браузъра. Освен промяната на показалеца на мишката в индикатор за връзка, не искам никакви други визуални промени при задържане. Това е базирана на bootstrap mediawiki тема, ако това помага.

Сайтът е: www.nebdat.com

Разбрах, че този раздел се нарича p-logo и опитах следното:

#p-logo:hover { background-color: transparent !important; }

Въпреки това изглежда не прави нищо. Въпреки това, когато опитам:

#p-logo:hover { opacity: 0; }

логото и фонът стават прозрачни, така че знам, че това е правилното име на обекта. Искам обаче името на логото да остане.

Надявам се, че има смисъл. Аз съм доста нов в това.

Надявам се да имате съвет.

Благодаря,

JT


person JT Bowlin    schedule 05.06.2013    source източник


Отговори (3)


Това трябва да го направи:

#p-logo > a {
    background: transparent;
}

Не изображението има фон при задържане на курсора на мишката, а маркерът за котва.

person Sean    schedule 05.06.2013
comment
Работи перфектно! Благодаря за вашата помощ. - person JT Bowlin; 06.06.2013
comment
Между другото, как разбра това? Използвах Firebug и трябваше да мине, а не › a, освен ако просто не го пропускам. - person JT Bowlin; 06.06.2013

@media screen
.nav > li > a:hover, .nav > li > a:focus {
text-decoration: none;
background-color: #eeeeee;
}

Това го причинява.

person Jonathan    schedule 05.06.2013

Не е нужно да го отменяте, можете просто да го премахнете. Намерете и премахнете този код от load.php:

img:hover{background:white url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAAAAAA6mKC9AAAAGElEQVQYV2N4DwX/oYBhgARgDJjEAAkAAEC99wFuu0VFAAAAAElFTkSuQmCC) repeat;background:white url(http://www.nebdat.com/wiki/skins/common/images/Checker-16x16.png?2013-05-25T13:38:20Z) repeat!ie}
person Omega    schedule 05.06.2013