Question

我知道这个问题之前已经被问到了，我已经做了一些谷歌搜索，看看我是否可以让它工作，但我找到的解决方案对我来说根本不起作用。这是我的代码

<div id="rightbar" class="float-r">
        <table width="100%" cellpadding="0" cellspacing="0">
        <tbody><tr>
            <td colspan="2"><a class="block active" href="dashboard.php">My Dashboard</a></td>
        </tr>           
        <tr>
            <td><a class="block" href="profile.php">My Profile</a></td>             
        </tr>           
        <tr>
            <td><a class="block" href="edit_profile.php">Edit Personal Details Form</a></td>                
        </tr>
        <tr>
            <td><a class="block" href="edit_form.php">Edit Members Form</a></td>                
        </tr>
        <tr>
            <td colspan="2" class="last-child"><a style="border-bottom:solid 1px #eaeaea;width:235px;" class="block" href="logout.php">Log Out</a></td>             
        </tr>
        </tbody></table>
    </div>

.float-r {
 float: right;
}

#rightbar {
background: #ffffff;
float: right;
width: 250px;
margin-top: 10px;
height: 530px;
margin-right: 10px; 
border-bottom: solid 1px #c8c9c9;
}

#rightbar a {
width:235px;
color: #000;
font-size:14px;
text-decoration:none;
}

#rightbar a:hover{
background-color:#efefef;
width:235px;
}

#rightbar a:active{
background-color:#eaeaea;
width:235px;
}

我希望当我点击一个链接并将其悬停在a：active后面的背景时，如果你滚动到顶部，你会看到问题，标签，用户，徽章等选项在每个链接上，背景更改为橙色。我想要那样的东西。感谢。

Answer 1

您的代码运行正常。你可以在这里看到我将它切换为红色，当你按住鼠标点击它可以正常工作。

https://jsfiddle.net/zk3sw43m/2/

为了清晰起见，

仅在此处更改了红色

 #rightbar a:active{
background-color:red;
width:235px;
}

Answer 2

您选择了非常接近的颜色：#efefef和#eaeaea，这就是为什么差异很难看到。

CSS a：活动伪类不工作

2 个答案: