asp.net-mvc-3 - css 不适用于标签

Question

我不是CSS人。我正在开发一个 MVC3 应用程序，其中有两个部分页面与主页上的两个选项卡链接。如果选中，我想更改选项卡背景。有什么建议么？请检查我的 CSS 波纹管。

ul#tabs-nav a:hover,
ul#tabs-nav a:focus {
  border-color: #ddd;
  border-bottom-color: #fff;
  background: #fff;
  text-decoration: none;
  color: #555;
  }

ul#tabs-nav a:selected 
 {
    background:red;
    text-decoration:underline;
 }

HTML

<div>
    <ul id="tabs-nav">
        <li><a href="../Home/Dogs">Dogs</a></li>
        <li><a href="../Home/Cats">Cats</a></li>
    </ul>
    <div class="tabbed-contents">
        @RenderBody()
    </div>
</div>

问候

Answer 1

像这样的东西 http://jsfiddle.net/KNCH6/这充其量只是一个例子，我不知道 MVC3，所以我不确定你想要的确切交互，但也许 jquery 将是你的 friend ，可以在单击时向选项卡添加类。我的 fiddle 只有在锚定焦点时才有效。因此，如果您单击焦点将关闭且效果将关闭的其他位置。