CSS / HTML活动/悬停（活动无效）

Question

嘿，

我遇到了问题，我必须为一个项目制作一个网页，不是经验丰富的程序员或网络开发人员，并且我对有效的CSS有问题。

目的是，当我将鼠标悬停在侧面菜单上时，它会改变颜色，而当单击它时，颜色将保持与悬停颜色相同，当我将鼠标悬停在侧面菜单选项卡（伙伴）上时，悬停部分会起作用它会改变颜色，但是当我单击它时，颜色不会改变，它消失的那一秒我将鼠标从侧面菜单选项卡上移开。

这是我的代码，我希望有人可以帮助我，我知道它的代码很乱。 CSS：

.buttonPartners a:hover{
    background: -webkit-gradient(linear, right bottom, left top, from(#585858 ), to(#A4A4A4));
}
.buttonPartners a:active { background: -webkit-gradient(linear, right bottom, left top, from(#585858 ), to(#A4A4A4));} 

HTML：

<div class ="buttonPartners"><a href="Partners.html">Partners</a></div>

这是该类的CSS：

.buttonPartners  a{
background: -webkit-gradient(linear, left top, right bottom, from( #B40404 ), to(#FF0000));
Color: white; text-decoration: none; text-align: center; border: 2px solid black; padding: 7px;  position: absolute; font-family: verdana;
top:320px; left:30px; width:105px; height:30px
}

希望任何人都知道。

Answer 1

：active伪选择器将在当前被鼠标光标按下时匹配。 通常只在瞬间就可以看到它，并提供视觉反馈，表明确实单击了该元素。

一种选择是使用a：visited，但它将为您按下的每个链接着色。

或使用一些jaavscript将一个类添加到属性，然后为该类设置颜色。

Answer 2

尝试这种方式：

.buttonPartners:hover{
    background: -webkit-gradient(linear, right bottom, left top, from(#585858 ), to(#A4A4A4));
}
.buttonPartners:active { background: -webkit-gradient(linear, right bottom, left top, from(#585858 ), to(#A4A4A4));}

还有一个问题，您使用的是PHP还是仅使用HTML？

Answer 3

我认为您对:active的概念有误

：active伪类在用户激活元素时适用。

在点击事件之后，这种情况仅持续了几毫秒的时间：

例如，在用户按下鼠标按钮并释放的时间之间。

来自W3 Wikki的信息。

Answer 4

浏览器可以查看更改了访问链接的背景，从而侵犯了用户的隐私，如下所示： background-image：用于：已访问的链接？

一个小jquery可以解决问题：

$('.buttonPartners a').click(function(){
  $(this).addClass('colored');
});

CSS：

.colored { 
   background: -webkit-gradient(linear, right bottom, left top, from(#585858 ),     to(#A4A4A4));
}

http://jsfiddle.net/4HERF/1/

同样，单击时激活意味着，我认为您在寻找：visited，这是单击链接后的属性。