Question

以下是母版页中的标签：

<nav>
     <ul id="menu">
         <li><%: Html.ActionLink("Home", "Index", "Home")%></li>
         <li><%: Html.ActionLink("About", "About", "Home")%></li>
     </ul>
</nav>

这是css：

ul#menu li.selected a {
    background-color: #a6e2a6;
    color: #000;
}

但无论我对背景色做什么，它总是保持不变。如何更改所选标签的背景颜色和高度？

Answer 1

:active选择器不会设置与当前页面对应的链接的样式，但会设置用户当前单击的链接的样式。

:active选择器与:hover选择器非常相似，后者会在用户将鼠标悬停在其上时对链接进行样式设置。它们都是响应鼠标操作的选择器。

以下示例显示了相当明显的行为：http://jsfiddle.net/NuExP/

修改问题后编辑：

喜欢@ o.v.说，当前活动页面没有选择器，所以他的解决方案是向链接添加一个类来指示它是当前活动页面是正确的。

Answer 2

我假设您正在尝试更改当前所选标签的样式？如果是这样，你应该将.current服务器端的css类添加到其中一个选项卡中（同样，你可能需要设置li元素的样式而不是其中的链接 - 但这一切都取决于当前的css结构）

:active伪类用于a different purpose，例如，当您点击并按住锚点时，可以看到它已应用。

MVC设置选项卡样式

2 个答案: